fix: 🤔 make styles available on CDN (#411)

solid-design-system · Sep 25, 2023 · 8048e94 · 8048e94
1 parent 097e7c1
commit 8048e94
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 13 deletions.
diff --git a/.github/workflows/size-check.yml b/.github/workflows/size-check.yml
@@ -28,7 +28,7 @@ jobs:
         run: PLAYWRIGHT_SKIP_BROWSER_DOWNLOAD=true pnpm i
 
       - name: build
-        run: cd packages/components && pnpm build.components
+        run: cd packages/components && pnpm build/components
 
       - name: Calculate package size
         id: calc_size

diff --git a/packages/components/package.json b/packages/components/package.json
@@ -50,21 +50,21 @@
   "scripts": {
     "start": "echo '❌ Please use `pnpm dev` instead.'",
     "dev": "pnpm storybook",
-    "build": "pnpm build.components && pnpm build.package && pnpm build.storybook && node ./scripts/node-version-components.cjs && pnpm build.styles",
-    "build.cdn": "pnpm build.components && pnpm build.storybook && node ./scripts/node-version-components.cjs",
-    "build.npm": "pnpm build.components && pnpm build.package && node ./scripts/node-version-components.cjs",
-    "build.components": "vite build  --config vite.config.js",
-    "build.styles": "vite build  --config vite.config.styles.js",
-    "build.package": "pnpm build.package/create-index && vite build --config vite.config.package.js && pnpm build.package/remove-index",
-    "build.package/create-index": "node scripts/node-generate-package-index.cjs && echo '✅ Index created'",
-    "build.package/remove-index": "node -e \"require('fs').unlinkSync('src/solid-components.package.ts')\" && echo '✅ Index removed'",
-    "build.storybook": "storybook build --output-dir dist/storybook && vite-node scripts/node-optimize-storybook.js",
-    "build.chromatic": "pnpm build.storybook && node ./scripts/node-optimize-chromatic.cjs",
+    "build": "pnpm build/components && pnpm build/styles && pnpm build/package && pnpm build/storybook && node ./scripts/node-version-components.cjs",
+    "build.cdn": "pnpm build/components && pnpm build/styles && pnpm build/storybook && node ./scripts/node-version-components.cjs",
+    "build.npm": "pnpm build/components && pnpm build/styles && pnpm build/package && node ./scripts/node-version-components.cjs",
+    "build.chromatic": "pnpm build/storybook && node ./scripts/node-optimize-chromatic.cjs",
+    "build/components": "vite build  --config vite.config.js",
+    "build/styles": "vite build  --config vite.config.styles.js",
+    "build/package": "pnpm build/package/create-index && vite build --config vite.config.package.js && pnpm build/package/remove-index",
+    "build/package/create-index": "node scripts/node-generate-package-index.cjs && echo '✅ Index created'",
+    "build/package/remove-index": "node -e \"require('fs').unlinkSync('src/solid-components.package.ts')\" && echo '✅ Index removed'",
+    "build/storybook": "storybook build --output-dir dist/storybook && vite-node scripts/node-optimize-storybook.js",
     "preview": "vite preview",
     "verify": "pnpm ts.verify && pnpm build && echo '✅ Build verified' && node ./scripts/node-optimize-chromatic.cjs && echo '✅ Chromatic optimization verified' && pnpm test.verify && echo '✅ Test verified'",
     "ts.verify": "tsc --noEmit --project ./tsconfig.json && echo '✅ TypeScript verified'",
     "plop": "plop --plopfile scripts/plop/plopfile.js",
-    "test": "pnpm build.components && web-test-runner --group default",
+    "test": "pnpm build/components && web-test-runner --group default",
     "test.verify": "web-test-runner --group default",
     "test.component": "web-test-runner -- --watch --group",
     "test.watch": "web-test-runner --watch --group default",

diff --git a/packages/components/src/docs/General/3-Installation.mdx b/packages/components/src/docs/General/3-Installation.mdx
@@ -119,7 +119,7 @@ This allows you to cherry pick the components you want to use and load them asyn
 />
 
 <Source language="html" code={`<!-- versioned e. g. <sd-1-1-0-button> -->
-<script src="${cdnBase}/${version}/components/es/button.js" type="module"></script>`}
+<script src="${cdnBase}/${version}/versioned-components/es/button.js" type="module"></script>`}
 />
 
 This approach will load only the components you need up front, while limiting the number of files the browser has to download.