Merge pull request #113 from storybookjs/module-build

Fix generated ESM, revamp build system

.eslintrc.js

@@ -1,6 +1,6 @@
 module.exports = {
   root: true,
-  extends: ['@storybook/eslint-config-storybook'],
+  extends: ['plugin:storybook/recommended'],
   rules: {
     '@typescript-eslint/dot-notation': 'off',
     '@typescript-eslint/no-implied-eval': 'off',

.github/workflows/chromatic.yml

@@ -4,9 +4,18 @@ jobs:
   publish:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v1
+      - uses: actions/checkout@v3
+        with:
+          fetch-depth: 0
+      - name: Install Node.js
+        uses: actions/setup-node@v3
+        with:
+          node-version: 20
       - name: Install dependencies
-        run: yarn
+        uses: pnpm/action-setup@v2
+        with:
+          version: 8
+          run_install: true
       - name: Publish to Chromatic
         uses: chromaui/action@v1
         with:

.github/workflows/release.yml

@@ -7,22 +7,25 @@ jobs:
     runs-on: ubuntu-latest
     if: "!contains(github.event.head_commit.message, 'ci skip') && !contains(github.event.head_commit.message, 'skip ci')"
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v3
 
       - name: Prepare repository
         run: git fetch --unshallow --tags
 
       - name: Use Node.js 20.x
-        uses: actions/setup-node@v1
+        uses: actions/setup-node@v3
         with:
           node-version: 20.x
 
       - name: Install dependencies
-        uses: bahmutov/npm-install@v1
+        uses: pnpm/action-setup@v2
+        with:
+          version: 8
+          run_install: true
 
       - name: Create Release
         env:
           GITHUB_TOKEN: ${{ secrets.GH_TOKEN }}
           NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
         run: |
-          yarn release
+          pnpm run release

.gitignore

@@ -4,4 +4,5 @@ storybook-static/
 build-storybook.log
 package-lock.json
 .DS_Store
-.env
+.env
+*.log

.storybook/main.ts

@@ -0,0 +1,14 @@
+import type { StorybookConfig } from '@storybook/svelte-vite';
+
+const config: StorybookConfig = {
+  framework: '@storybook/svelte-vite',
+  stories: [
+    '../stories/**/*.stories.svelte',
+  ],
+  addons: [
+    '../dist/preset/index.js',
+    '@storybook/addon-essentials',
+    '@storybook/addon-interactions',
+  ],
+};
+export default config;

package.json

@@ -11,9 +11,21 @@
     "url": "https://github.com/storybookjs/addon-svelte-csf"
   },
   "license": "MIT",
-  "main": "dist/cjs/index.js",
-  "module": "dist/esm/index.js",
-  "browser": "dist/cjs/index.js",
+  "type": "module",
+  "exports": {
+    ".": {
+      "svelte": "./dist/index.js",
+      "types": "./dist/index.d.ts"
+    },
+    "./preset": {
+      "types": "./dist/preset/index.d.ts",
+      "default": "./dist/preset/index.js"
+    },
+    "./manager": {
+      "types": "./dist/preset/manager.d.ts",
+      "default": "./dist/preset/manager.js"
+    }
+  },
   "files": [
     "dist/**/*",
     "README.md",
@@ -22,64 +34,64 @@
   ],
   "scripts": {
     "clean": "rimraf ./dist",
-    "build": "concurrently \"yarn build:cjs\" \"yarn build:esm\"",
-    "build:cjs": "babel ./src -d ./dist/cjs --extensions \".js,.ts\" --copy-files",
-    "build:esm": "babel ./src -d ./dist/esm --env-name esm --extensions \".js,.ts\" --copy-files",
-    "prepublish": "yarn clean && yarn build",
-    "test": "jest",
+    "build": "svelte-package --input ./src --types",
+    "prepublish": "pnpm run clean && pnpm run build",
+    "test": "vitest run",
+    "chromatic": "chromatic --exit-zero-on-changes",
+    "coverage": "vitest run --coverage",
     "lint": "eslint --cache --cache-location=.cache/eslint --ext .js,.jsx,.json,.html,.ts,.tsx,.mjs --report-unused-disable-directives",
-    "storybook": "sb dev -p 6006",
-    "start": "concurrently \"yarn storybook --quiet\" \"yarn build -- --watch\"",
-    "build-storybook": "sb build",
-    "release": "yarn build && auto shipit"
+    "storybook": "storybook dev --port 6006",
+    "start": "concurrently \"pnpm run storybook --quiet\" \"pnpm run build --watch\"",
+    "build-storybook": "storybook build",
+    "release": "pnpm run build && auto shipit"
   },
   "dependencies": {
-    "@babel/runtime": "^7.21.0",
+    "@babel/runtime": "^7.22.6",
+    "dedent": "^1.2.0",
     "fs-extra": "^11.1.1",
-    "magic-string": "^0.30.0",
-    "ts-dedent": "^2.0.0"
+    "magic-string": "^0.30.1"
   },
   "devDependencies": {
     "@auto-it/released": "^10.32.6",
-    "@babel/cli": "^7.21.0",
-    "@babel/core": "^7.21.4",
-    "@babel/plugin-transform-runtime": "^7.21.4",
-    "@babel/preset-env": "^7.21.4",
-    "@babel/preset-react": "^7.18.6",
-    "@babel/preset-typescript": "^7.21.4",
-    "@storybook/addon-essentials": "^7.0.27",
-    "@storybook/addon-interactions": "^7.0.27",
-    "@storybook/addon-storyshots": "^7.0.27",
-    "@storybook/core-client": "^7.0.27",
-    "@storybook/core-server": "^7.0.27",
+    "@storybook/addon-actions": "^7.1.1",
+    "@storybook/addon-essentials": "^7.1.1",
+    "@storybook/addon-interactions": "^7.1.1",
+    "@storybook/client-api": "^7.1.1",
+    "@storybook/client-logger": "^7.1.1",
+    "@storybook/core-client": "^7.1.1",
+    "@storybook/core-server": "^7.1.1",
+    "@storybook/csf": "^0.1.1",
     "@storybook/eslint-config-storybook": "^3.1.2",
-    "@storybook/jest": "^0.0.10",
-    "@storybook/svelte": "^7.0.27",
-    "@storybook/svelte-webpack5": "^7.0.27",
-    "@storybook/testing-library": "^0.0.13",
-    "@storybook/types": "^7.0.27",
+    "@storybook/jest": "^0.1.0",
+    "@storybook/svelte": "^7.1.1",
+    "@storybook/svelte-vite": "^7.1.1",
+    "@storybook/test-runner": "^0.11.0",
+    "@storybook/testing-library": "^0.2.0",
+    "@storybook/types": "^7.1.1",
+    "@sveltejs/package": "^2.2.0",
+    "@sveltejs/vite-plugin-svelte": "^2.4.2",
+    "@tsconfig/svelte": "^5.0.0",
     "auto": "^10.43.0",
-    "babel-jest": "^29.5.0",
-    "babel-loader": "^8.1.0",
-    "chromatic": "^6.17.2",
-    "concurrently": "^6.2.0",
+    "chromatic": "^6.19.9",
+    "concurrently": "^8.2.0",
     "eslint": "^7.17.0",
-    "jest": "^29.5.0",
-    "jest-environment-jsdom": "^29.5.0",
-    "prettier": "^2.8.7",
-    "react": "^17.0.1",
-    "react-dom": "^17.0.1",
+    "eslint-plugin-storybook": "^0.6.12",
+    "jsdom": "^22.1.0",
+    "prettier": "^3.0.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
     "rimraf": "^3.0.2",
-    "sb": "^7.0.27",
+    "storybook": "^7.1.1",
     "svelte": "^4.0.0",
     "svelte-jester": "^2.3.2",
     "svelte-loader": "^3.1.7",
-    "typescript": "^5.0.0",
-    "vite": "^3.1.4"
+    "typescript": "^5.1.6",
+    "vite": "^4.4.3",
+    "vitest": "^0.33.0"
   },
   "peerDependencies": {
-    "@storybook/svelte": "^7.0.0-beta.0 || ^7.0.0-rc.0 || ^7.0.0",
-    "@storybook/theming": "^7.0.0-beta.0 || ^7.0.0-rc.0 || ^7.0.0",
+    "@storybook/svelte": "^7.0.0",
+    "@storybook/theming": "^7.0.0",
     "@sveltejs/vite-plugin-svelte": "^1.0.0 || ^2.0.0",
     "svelte": "^3.50.0 || ^4.0.0",
     "svelte-loader": "^3.1.2",