install state with parcel-bundler-storybook local

Author: snowystinger

package.json

@@ -263,6 +263,9 @@
   "alias": {
     "@storybook/react-dom-shim": "@storybook/react-dom-shim/dist/react-18"
   },
+  "@parcel/resolver-default": {
+    "packageExports": true
+  },
   "@parcel/bundler-default": {
     "manualSharedBundles": [
       {

packages/dev/parcel-config-storybook/package.json

@@ -0,0 +1,23 @@
+{
+  "name": "@parcel/config-storybook",
+  "version": "0.0.2",
+  "main": "storybook-config.json",
+  "engines": {
+    "parcel": "^2.8.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "dependencies": {
+    "@parcel/config-default": "^2.13.1",
+    "@parcel/core": "^2.13.1",
+    "@parcel/resolver-storybook": "^0.0.0",
+    "@parcel/transformer-js": "^2.13.1",
+    "@parcel/transformer-react-refresh-wrap": "^2.13.1",
+    "@parcel/transformer-storybook": "^0.0.2"
+  },
+  "scripts": {
+    "build": "true",
+    "clean": "true"
+  }
+}

packages/dev/parcel-config-storybook/storybook-config.json

@@ -0,0 +1,15 @@
+{
+  "extends": "@parcel/config-default",
+  "resolvers": ["@parcel/resolver-storybook", "..."],
+  "transformers": {
+    "story:*": ["..."],
+    "*.stories.{ts,tsx,js,mjs,jsm,jsx,es6,cjs}": [
+      "@parcel/transformer-storybook",
+      "@parcel/transformer-js"
+    ],
+    "*.{js,mjs,jsm,jsx,es6,cjs,ts,tsx}": [
+      "@parcel/transformer-js",
+      "@parcel/transformer-react-refresh-wrap"
+    ]
+  }
+}

packages/dev/parcel-resolver-storybook/StorybookResolver.ts

@@ -0,0 +1,54 @@
+import path from 'path';
+import { Resolver } from "@parcel/plugin";
+const reactVersion = require("react-dom/package.json").version;
+import { default as NodeResolver } from "@parcel/node-resolver-core";
+// @ts-ignore
+import { isGlob, glob, normalizeSeparators, relativePath } from '@parcel/utils';
+
+const REACT_MAJOR_VERSION = parseInt(reactVersion.split('.')[0], 10);
+
+module.exports = new Resolver({
+  async resolve({ dependency, options, specifier, pipeline, logger }) {
+    // Workaround for interop issue
+    if (specifier === "react-dom/client" && REACT_MAJOR_VERSION < 18) {
+      return {
+        filePath: __dirname + "/react.js",
+        code: `
+        export * from 'react-dom';
+        export * as default from 'react-dom'
+        `,
+      };
+    }
+
+    // Resolve story entry globs. Storybook expects an object with relative paths from the process cwd as keys.
+    // We do this in a resolver so that it invalidates the watcher when new stories are created.
+    if (pipeline === 'story') {
+      let sourceFile = dependency.resolveFrom ?? dependency.sourcePath!;
+      let normalized = normalizeSeparators(path.resolve(path.dirname(sourceFile), atob(specifier)));
+      let files = await glob(normalized, options.inputFS, {
+        onlyFiles: true,
+      });
+
+      let cwd = process.cwd();
+      let dir = path.dirname(sourceFile);
+      let results = files.map(file => {
+        let key = relativePath(cwd, file);
+        let relative = relativePath(dir, file);
+        return `  ${JSON.stringify(key)}: () => import(${JSON.stringify(relative)}),\n`;
+      });
+
+      return {
+        filePath: path.join(
+          dir,
+          'stories.js'
+        ),
+        code: `module.exports = {\n${results.join('\n')}\n};\n`,
+        invalidateOnFileCreate: [
+          {glob: normalized}
+        ],
+        pipeline: null,
+        priority: 'sync',
+      };
+    }
+  },
+});

packages/dev/parcel-resolver-storybook/index.js

@@ -0,0 +1 @@
+module.exports = require('./StorybookResolver.ts');

packages/dev/parcel-resolver-storybook/package.json

@@ -0,0 +1,21 @@
+{
+  "name": "@parcel/resolver-storybook",
+  "version": "0.0.0",
+  "main": "dist/StorybookResolver.js",
+  "source": "StorybookResolver.ts",
+  "publishConfig": {
+    "access": "public"
+  },
+  "engines": {
+    "parcel": "^2.8.0"
+  },
+  "dependencies": {
+    "@parcel/core": "^2.13.1",
+    "@parcel/node-resolver-core": "^3.1.2",
+    "@parcel/plugin": "^2.10.2"
+  },
+  "scripts": {
+    "build": "rm -rf dist && swc . -d dist --config-file ../../.swcrc",
+    "clean": "rm -rf dist"
+  }
+}