Description
Code of conduct
- I agree to follow this project's code of conduct.
Description of issue
Hi Spectrum Team,
The Getting Started page https://opensource.adobe.com/spectrum-web-components/getting-started/ suggests loading the library with:
<script
src="https://jspm.dev/@spectrum-web-components/bundle/elements.js"
type="module"
async
></script>Unfortunately, that loads v0.40 which was published in 2023-11.
% curl -s https://jspm.dev/@spectrum-web-components/bundle/elements.js |head
import "/npm:@spectrum-web-components/[email protected]/sp-accordion.js";
import "/npm:@spectrum-web-components/[email protected]/sp-accordion-item.js";
import "/npm:@spectrum-web-components/[email protected]/sp-action-bar.js";
import "/npm:@spectrum-web-components/[email protected]/sp-action-button.js";
import "/npm:@spectrum-web-components/[email protected]/sp-action-group.js";
import "/npm:@spectrum-web-components/[email protected]/sp-action-menu.js";
import "/npm:@spectrum-web-components/alert-dialog/sp-alert-dialog.js";
import "/npm:@spectrum-web-components/[email protected]/sp-asset.js";
import "/npm:@spectrum-web-components/[email protected]/sp-avatar.js";
import "/npm:@spectrum-web-components/[email protected]/sp-badge.js";
My partner is doing a masters degree in Design, taking a coding course using Adobe Spectrum Web Components. The class is struggling with bugs (sp-number-field field ignores min), missing components (breadcrumbs), and mismatches between the docs and the code. I think these are due to them using an old version of the library.
Would you please deploy the latest version of the library to jspm.dev?
Another option is to build the @spectrum-web-components/bundle package and its dependencies and host the bundle.js with GitHub Pages.
Sincerely,
Michael
I built the bundle and it loads (creating <slot> elements), but styles are not working.
index.jsimport * as spectrum from "@spectrum-web-components/bundle"; window.spectrum=spectrum;
index.html<!DOCTYPE html> <html lang='en'> <head> <script src="spectrum.js" async></script> </head> <body> <sp-theme system="express" color="light" scale="large"> <sp-button>ABC</sp-button> </sp-theme> </body> </html>
package.json{ "main": "index.js", "dependencies": { "@spectrum-web-components/bundle": "1.4.0", "esbuild": "0.25.2" } }
example % docker run --rm --volume .:/src node:23 /usr/bin/env bash -c \
'cd /src && npm i && npx esbuild index.js --bundle --outfile=spectrum.js --format=iife --global-name=spectrum'
up to date, audited 96 packages in 323ms
found 0 vulnerabilities
npm notice
npm notice New major version of npm available! 10.9.2 -> 11.3.0
npm notice Changelog: https://github.com/npm/cli/releases/tag/v11.3.0
npm notice To update run: npm install -g [email protected]
npm notice
spectrum.js 1.6mb ⚠️
⚡ Done in 186ms
example % open index.html
example % cd ..
~ % zip example.zip example/index.* example/package.json example/spectrum.js
adding: example/index.html (deflated 28%)
adding: example/index.js (deflated 21%)
adding: example/package.json (deflated 15%)
adding: example/spectrum.js (deflated 83%)