Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bug] Cannot build storybook in amplify, missing "@storybook/core-common" #298

Open
lostdesign opened this issue Mar 31, 2022 · 17 comments
Open
Labels
bug Something isn't working

Comments

@lostdesign
Copy link

Describe the bug

When running build-storybook inside amplify, the pipeline crashes with the error

Error: Cannot find module '@storybook/core-common'
ERR! Require stack:
ERR! - /codebuild/output/src926997390/src/oxy/node_modules/@storybook/builder-vite/dist/transform-iframe-html.js

.... (fullstack trace at the end)

I have tried installing it (despite you would not need to) but then get a new error 2022-03-31T17:46:11.175Z [WARNING]: Error: [vite]: Rollup failed to resolve import "react-dom" from "node_modules/@storybook/components/dist/esm/WithTooltip-cb7d27cb.js".

It builds locally just fine however.

Steps to reproduce the behavior

Our package.json

  "devDependencies": {
    "@babel/core": "7.16.12",
    "@fortawesome/fontawesome-svg-core": "1.2.34",
    "@fortawesome/free-regular-svg-icons": "5.15.2",
    "@fortawesome/free-solid-svg-icons": "5.15.2",
    "@fortawesome/pro-light-svg-icons": "5.14.0",
    "@fortawesome/pro-solid-svg-icons": "5.14.0",
    "@fortawesome/vue-fontawesome": "3.0.0-5",
    "@semantic-release/changelog": "6.0.1",
    "@semantic-release/git": "10.0.1",
    "@semantic-release/npm": "9.0.1",
    "@storybook/addon-actions": "6.5.0-alpha.51",
    "@storybook/addon-docs": "6.5.0-alpha.51",
    "@storybook/addon-essentials": "6.5.0-alpha.51",
    "@storybook/addon-links": "6.5.0-alpha.51",
    "@storybook/builder-vite": "0.1.22",
    "@storybook/core-common": "6.4.19",
    "@storybook/vue3": "6.5.0-alpha.51",
    "@tailwindcss/aspect-ratio": "0.4.0",
    "@tailwindcss/forms": "0.4.0",
    "@tailwindcss/line-clamp": "0.3.1",
    "@tailwindcss/typography": "0.5.0",
    "@testing-library/vue": "6.5.1",
    "@vitejs/plugin-vue": "2.1.0",
    "@vue/test-utils": "2.0.0-rc.18",
    "autoprefixer": "10.4.2",
    "babel-loader": "8.2.3",
    "chromatic": "6.3.4",
    "postcss": "8.4.5",
    "react": "17.0.2",
    "semantic-release": "19.0.2",
    "tailwindcss": "3.0.15",
    "typescript": "4.5.5",
    "vite": "2.7.13",
    "vitest": "0.7.12",
    "vue": "3.2.29",
    "vue-loader": "16.8.3",
    "vue-tsc": "0.29.8"
  }

main.js

const path = require("path");

module.exports = {
  stories: ["../src/**/*.stories.@(js|jsx|ts|tsx|mdx)"],
  addons: [
    "@storybook/addon-links",
    "@storybook/addon-essentials",
    "@storybook/addon-docs",
    {
      name: "@storybook/addon-postcss",
      options: {
        postcssLoaderOptions: {
          implementation: require("postcss"),
        },
      },
    },
  ],
  framework: "@storybook/vue3",
  core: {
    builder: "@storybook/builder-vite",
  },
  async viteFinal(config, { configType }) {
    return {
      ...config,
      resolve: {
        alias: [
          {
            find: "@",
            replacement: path.resolve(__dirname, "../src"),
          },
          /* https://v3.vuejs.org/guide/installation.html#for-server-side-rendering */
          {
            find: "vue",
            replacement: path.resolve(__dirname, "../node_modules/vue/dist/vue.esm-bundler.js"),
          },
        ],
      },
    };
  },
};

preview.js

import '../src/assets/tailwind.css'

export const parameters = {
  actions: { argTypesRegex: "^on[A-Z].*" },
  controls: {
    matchers: {
      color: /(background|color)$/i,
      date: /Date$/,
    },
  },
}

vite.config.ts

import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";
import path from "path";

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [vue()],
  resolve: {
    alias: {
      "@": path.resolve(__dirname, "./src"),
    },
  },
  build: {
    lib: {
      entry: path.resolve(__dirname, 'src/index.js'),
      name: 'oxy',
      fileName: (format) => `oxy.${format}.js`
    },
    rollupOptions: {
      external: ['vue'],
      output: {
        globals: {
          vue: 'Vue'
        }
      }
    }
  },
});

Expected behavior

Storybook should build in amplify as well.

Environment

  • OS: docker node:16.13
  • Node.js version: 16.12.3
  • NPM version: 8.1.2

Additional context

Full Stack Trace without @storybook/core-common installed:

2022-03-31T17:37:01.403Z [WARNING]: Error: Cannot find module '@storybook/core-common'
                                    ERR! Require stack:
                                    ERR! - /codebuild/output/src926997390/src/oxy/node_modules/@storybook/builder-vite/dist/transform-iframe-html.js
                                    ERR! - /codebuild/output/src926997390/src/oxy/node_modules/@storybook/builder-vite/dist/index.js
                                    ERR! - /codebuild/output/src926997390/src/oxy/node_modules/@storybook/core-server/dist/cjs/utils/get-preview-builder.js
                                    ERR! - /codebuild/output/src926997390/src/oxy/node_modules/@storybook/core-server/dist/cjs/build-static.js
                                    ERR! - /codebuild/output/src926997390/src/oxy/node_modules/@storybook/core-server/dist/cjs/index.js
                                    ERR! - /codebuild/output/src926997390/src/oxy/node_modules/@storybook/core/dist/cjs/server.js
                                    ERR! - /codebuild/output/src926997390/src/oxy/node_modules/@storybook/core/server.js
                                    ERR! - /codebuild/output/src926997390/src/oxy/node_modules/@storybook/vue3/dist/cjs/server/build.js
                                    ERR! - /codebuild/output/src926997390/src/oxy/node_modules/@storybook/vue3/bin/build.js
                                    ERR!     at Function.Module._resolveFilename (internal/modules/cjs/loader.js:902:15)
                                    ERR!     at Function.Module._load (internal/modules/cjs/loader.js:746:27)
                                    ERR!     at Module.require (internal/modules/cjs/loader.js:974:19)
                                    ERR!     at require (internal/modules/cjs/helpers.js:101:18)
                                    ERR!     at Object.<anonymous> (/codebuild/output/src926997390/src/oxy/node_modules/@storybook/builder-vite/dist/transform-iframe-html.js:4:23)
                                    ERR!     at Module._compile (internal/modules/cjs/loader.js:1085:14)
                                    ERR!     at Object.Module._extensions..js (internal/modules/cjs/loader.js:1114:10)
                                    ERR!     at Module.load (internal/modules/cjs/loader.js:950:32)
                                    ERR!     at Function.Module._load (internal/modules/cjs/loader.js:790:12)
                                    ERR!     at Module.require (internal/modules/cjs/loader.js:974:19)
                                    ERR!     at require (internal/modules/cjs/helpers.js:101:18)
                                    ERR!     at Object.<anonymous> (/codebuild/output/src926997390/src/oxy/node_modules/@storybook/builder-vite/dist/index.js:26:33)
                                    ERR!     at Module._compile (internal/modules/cjs/loader.js:1085:14)
                                    ERR!     at Object.Module._extensions..js (internal/modules/cjs/loader.js:1114:10)
                                    ERR!     at Module.load (internal/modules/cjs/loader.js:950:32)
                                    ERR!     at Function.Module._load (internal/modules/cjs/loader.js:790:12)
                                    ERR!  Error: Cannot find module '@storybook/core-common'
                                    ERR! Require stack:
                                    ERR! - /codebuild/output/src926997390/src/oxy/node_modules/@storybook/builder-vite/dist/transform-iframe-html.js
                                    ERR!
2022-03-31T17:37:01.404Z [WARNING]: - /codebuild/output/src926997390/src/oxy/node_modules/@storybook/builder-vite/dist/index.js
                                    ERR! - /codebuild/output/src926997390/src/oxy/node_modules/@storybook/core-server/dist/cjs/utils/get-preview-builder.js
                                    ERR! - /codebuild/output/src926997390/src/oxy/node_modules/@storybook/core-server/dist/cjs/build-static.js
                                    ERR! - /codebuild/output/src926997390/src/oxy/node_modules/@storybook/core-server/dist/cjs/index.js
                                    ERR! - /codebuild/output/src926997390/src/oxy/node_modules/@storybook/core/dist/cjs/server.js
                                    ERR! - /codebuild/output/src926997390/src/oxy/node_modules/@storybook/core/server.js
                                    ERR! - /codebuild/output/src926997390/src/oxy/node_modules/@storybook/vue3/dist/cjs/server/build.js
                                    ERR! - /codebuild/output/src926997390/src/oxy/node_modules/@storybook/vue3/bin/build.js
                                    ERR!     at Function.Module._resolveFilename (internal/modules/cjs/loader.js:902:15)
                                    ERR!     at Function.Module._load (internal/modules/cjs/loader.js:746:27)
                                    ERR!     at Module.require (internal/modules/cjs/loader.js:974:19)
                                    ERR!     at require (internal/modules/cjs/helpers.js:101:18)
                                    ERR!     at Object.<anonymous> (/codebuild/output/src926997390/src/oxy/node_modules/@storybook/builder-vite/dist/transform-iframe-html.js:4:23)
                                    ERR!     at Module._compile (internal/modules/cjs/loader.js:1085:14)
                                    ERR!     at Object.Module._extensions..js (internal/modules/cjs/loader.js:1114:10)
                                    ERR!     at Module.load (internal/modules/cjs/loader.js:950:32)
                                    ERR!     at Function.Module._load (internal/modules/cjs/loader.js:790:12)
                                    ERR!     at Module.require (internal/modules/cjs/loader.js:974:19)
                                    ERR!     at require (internal/modules/cjs/helpers.js:101:18)
                                    ERR!     at Object.<anonymous> (/codebuild/output/src926997390/src/oxy/node_modules/@storybook/builder-vite/dist/index.js:26:33)
                                    ERR!     at Module._compile (internal/modules/cjs/loader.js:1085:14)
                                    ERR!     at Object.Module._extensions..js (internal/modules/cjs/loader.js:1114:10)
                                    ERR!     at Module.load (internal/modules/cjs/loader.js:950:32)
                                    ERR!     at Function.Module._load (internal/modules/cjs/loader.js:790:12) {
                                    ERR!   code: 'MODULE_NOT_FOUND',
                                    ERR!
2022-03-31T17:37:01.404Z [WARNING]: requireStack: [
                                    ERR!     '/codebuild/output/src926997390/src/oxy/node_modules/@storybook/builder-vite/dist/transform-iframe-html.js',
                                    ERR!     '/codebuild/output/src926997390/src/oxy/node_modules/@storybook/builder-vite/dist/index.js',
                                    ERR!     '/codebuild/output/src926997390/src/oxy/node_modules/@storybook/core-server/dist/cjs/utils/get-preview-builder.js',
                                    ERR!     '/codebuild/output/src926997390/src/oxy/node_modules/@storybook/core-server/dist/cjs/build-static.js',
                                    ERR!     '/codebuild/output/src926997390/src/oxy/node_modules/@storybook/core-server/dist/cjs/index.js',
                                    ERR!     '/codebuild/output/src926997390/src/oxy/node_modules/@storybook/core/dist/cjs/server.js',
                                    ERR!     '/codebuild/output/src926997390/src/oxy/node_modules/@storybook/core/server.js',
                                    ERR!     '/codebuild/output/src926997390/src/oxy/node_modules/@storybook/vue3/dist/cjs/server/build.js',
                                    ERR!     '/codebuild/output/src926997390/src/oxy/node_modules/@storybook/vue3/bin/build.js'
                                    ERR!   ]
                                    ERR! }
2022-03-31T17:37:01.413Z [WARNING]: npm
2022-03-31T17:37:01.413Z [WARNING]: ERR! code ELIFECYCLE
                                    npm ERR! errno 1
2022-03-31T17:37:01.416Z [WARNING]: npm
2022-03-31T17:37:01.416Z [WARNING]: ERR! @iu/oxy@1.0.0-beta.2 storybook:build: `build-storybook`
                                    npm ERR! Exit status 1
                                    npm ERR!
                                    npm ERR! Failed at the @iu/oxy@1.0.0-beta.2 storybook:build script.
                                    npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

Full Stack Trace with @storybook/core-common installed:

2022-03-31T17:46:11.174Z [WARNING]: [vite]: Rollup failed to resolve import "react-dom" from "node_modules/@storybook/components/dist/esm/WithTooltip-cb7d27cb.js".
                                    This is most likely unintended because it can break your application at runtime.
                                    If you do want to externalize this module explicitly add it to
                                    `build.rollupOptions.external`
2022-03-31T17:46:11.175Z [WARNING]: ERR!
2022-03-31T17:46:11.175Z [WARNING]: Error: [vite]: Rollup failed to resolve import "react-dom" from "node_modules/@storybook/components/dist/esm/WithTooltip-cb7d27cb.js".
                                    ERR! This is most likely unintended because it can break your application at runtime.
                                    ERR! If you do want to externalize this module explicitly add it to
                                    ERR! `build.rollupOptions.external`
                                    ERR!     at onRollupWarning (/codebuild/output/src317918707/src/oxy/node_modules/vite/dist/node/chunks/dep-f5552faa.js:37915:19)
                                    ERR!     at onwarn (/codebuild/output/src317918707/src/oxy/node_modules/vite/dist/node/chunks/dep-f5552faa.js:37693:13)
                                    ERR!     at Object.onwarn (/codebuild/output/src317918707/src/oxy/node_modules/rollup/dist/shared/rollup.js:23153:13)
                                    ERR!     at ModuleLoader.handleResolveId (/codebuild/output/src317918707/src/oxy/node_modules/rollup/dist/shared/rollup.js:22431:26)
                                    ERR!     at /codebuild/output/src317918707/src/oxy/node_modules/rollup/dist/shared/rollup.js:22392:26
                                    ERR!  Error: [vite]: Rollup failed to resolve import "react-dom" from "node_modules/@storybook/components/dist/esm/WithTooltip-cb7d27cb.js".
                                    ERR! This is most likely unintended because it can break your application at runtime.
                                    ERR! If you do want to externalize this module explicitly add it to
                                    ERR! `build.rollupOptions.external`
                                    ERR!     at onRollupWarning (/codebuild/output/src317918707/src/oxy/node_modules/vite/dist/node/chunks/dep-f5552faa.js:37915:19)
                                    ERR!     at onwarn (/codebuild/output/src317918707/src/oxy/node_modules/vite/dist/node/chunks/dep-f5552faa.js:37693:13)
                                    ERR!     at Object.onwarn (/codebuild/output/src317918707/src/oxy/node_modules/rollup/dist/shared/rollup.js:23153:13)
                                    ERR!     at ModuleLoader.handleResolveId (/codebuild/output/src317918707/src/oxy/node_modules/rollup/dist/shared/rollup.js:22431:26)
                                    ERR!     at /codebuild/output/src317918707/src/oxy/node_modules/rollup/dist/shared/rollup.js:22392:26 {
                                    ERR!   watchFiles: [
2022-03-31T17:46:11.176Z [WARNING]: ERR!     '/codebuild/output/src317918707/src/oxy/iframe.html',
                                    ERR!     '/virtual:/@storybook/builder-vite/vite-app.js',
                                    ERR!     'vite/modulepreload-polyfill',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/client-api/package.json',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/client-logger/package.json',
                                    ERR!     '/virtual:/@storybook/builder-vite/preview-entry.js',
                                    ERR!     '/virtual:/@storybook/builder-vite/storybook-stories.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/client-api/dist/esm/index.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/client-logger/dist/esm/index.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/addon-docs/dist/esm/frameworks/common/config.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/vue3/dist/esm/client/preview/config.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/vue3/dist/esm/client/docs/config.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/addon-links/dist/esm/preset/addDecorator.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/addon-actions/dist/esm/preset/addDecorator.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/addon-actions/dist/esm/preset/addArgs.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/addon-backgrounds/dist/esm/preset/addDecorator.js',
                                    ERR!
2022-03-31T17:46:11.176Z [WARNING]: '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/addon-backgrounds/dist/esm/preset/addParameter.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/addon-measure/dist/esm/preset/addDecorator.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/addon-outline/dist/esm/preset/addDecorator.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/.storybook/preview.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/store/package.json',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/client-api/dist/esm/ClientApi.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/client-api/dist/esm/types.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/client-api/dist/esm/queryparams.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/store/dist/esm/index.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/core-js/package.json',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/global/package.json',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/core-js/modules/es.array.concat.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/core-js/modules/es.array.iterator.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/core-js/modules/es.object.to-string.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/core-js/modules/es.set.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/core-js/modules/es.string.iterator.js',
                                    ERR!
2022-03-31T17:46:11.176Z [WARNING]: '/codebuild/output/src317918707/src/oxy/node_modules/core-js/modules/web.dom-collections.iterator.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/core-js/modules/es.regexp.exec.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/core-js/modules/es.string.replace.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/global/window.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/regenerator-runtime/package.json',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/regenerator-runtime/runtime.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/core-js/modules/es.promise.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/addon-docs/dist/esm/blocks/index.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/vue3/dist/esm/client/preview/render.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/vue3/dist/esm/client/preview/decorateStory.js',
                                    ERR!
2022-03-31T17:46:11.176Z [WARNING]: '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/docs-tools/package.json',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/docs-tools/dist/esm/index.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/vue3/dist/esm/client/docs/extractArgTypes.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/vue3/dist/esm/client/docs/prepareForInline.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/addon-links/dist/esm/index.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/addon-actions/dist/esm/index.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/addon-actions/dist/esm/preset/addArgsHelpers.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/addon-backgrounds/dist/esm/decorators/index.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/addon-measure/dist/esm/withMeasure.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/addon-measure/dist/esm/constants.js',
                                    ERR!
2022-03-31T17:46:11.176Z [WARNING]: '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/addon-outline/dist/esm/withOutline.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/addon-outline/dist/esm/constants.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/src/assets/tailwind.css',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/vue3/package.json',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/vue3/dist/esm/client/index.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/src/components/input/Input.stories.mdx',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/src/docs/guide/01-Introduction.stories.mdx',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/src/docs/guide/02-How-to-use.stories.mdx',
2022-03-31T17:46:11.177Z [WARNING]: ERR!     '/codebuild/output/src317918707/src/oxy/src/docs/guide/99-Contribute.stories.mdx',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/util-deprecate/package.json',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/ts-dedent/package.json',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/client-api/node_modules/@storybook/csf/package.json',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/core-js/modules/es.array.slice.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/core-js/modules/es.object.freeze.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/core-js/modules/es.symbol.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/core-js/modules/es.symbol.description.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/core-js/modules/es.symbol.iterator.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/core-js/modules/es.array.from.js',
2022-03-31T17:46:11.177Z [WARNING]: ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/core-js/modules/es.object.assign.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/core-js/modules/es.object.get-prototype-of.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/core-js/modules/es.regexp.to-string.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/core-js/modules/es.object.keys.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/core-js/modules/web.dom-collections.for-each.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/core-js/modules/es.object.entries.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/core-js/modules/es.function.name.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/core-js/modules/es.object.values.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/util-deprecate/browser.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/ts-dedent/esm/index.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/client-api/node_modules/@storybook/csf/dist/index.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/client-api/dist/esm/StoryStoreFacade.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/qs/package.json',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/core-js/modules/es.string.search.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/qs/lib/index.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/store/dist/esm/StoryStore.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/store/dist/esm/parameters.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/store/dist/esm/filterArgTypes.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/store/dist/esm/inferControls.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/store/dist/esm/types.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/store/dist/esm/csf/index.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/store/dist/esm/hooks.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/store/dist/esm/decorators.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/store/dist/esm/args.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/store/dist/esm/autoTitle.js',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/store/dist/esm/sortStories.js',
                                    ERR!     '\x00commonjsHelpers.js',
                                    ERR!     '\x00/codebuild/output/src317918707/src/oxy/node_modules/regenerator-runtime/runtime.js?commonjs-module',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/components/package.json',
                                    ERR!     '/codebuild/output/src317918707/src/oxy/node_modules/@storybook/components/dist/esm/index.js',
                                    ERR!     ... 366 more items
                                    ERR!   ]
                                    ERR! }
2022-03-31T17:46:11.177Z [WARNING]: [!] Error: unfinished hook action(s) on exit:
                                    (vite:load-fallback) load "/codebuild/output/src317918707/src/oxy/node_modules/@storybook/components/dist/esm/Color-5a8891ca.js"
                                    (vite:load-fallback) load "/codebuild/output/src317918707/src/oxy/node_modules/@storybook/components/node_modules/@storybook/csf/dist/story.js"
                                    (commonjs) load "\u0000/codebuild/output/src317918707/src/oxy/node_modules/@storybook/components/node_modules/@storybook/csf/dist/story.js?commonjs-proxy"
                                    (vite:load-fallback) load "/codebuild/output/src317918707/src/oxy/node_modules/@storybook/addon-docs/node_modules/@storybook/csf/dist/story.js"
                                    (commonjs) load "\u0000/codebuild/output/src317918707/src/oxy/node_modules/@storybook/addon-docs/node_modules/@storybook/csf/dist/story.js?commonjs-proxy"
                                    (vite:load-fallback) load "/codebuild/output/src317918707/src/oxy/node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js"
                                    (vite:load-fallback) load "/codebuild/output/src317918707/src/oxy/node_modules/@vue/compiler-core/dist/compiler-core.esm-bundler.js"
                                    (vite:load-fallback) load "/codebuild/output/src317918707/src/oxy/node_modules/@storybook/docs-tools/dist/esm/argTypes/convert/typescript/index.js"
                                    (vite:load-fallback) load "/codebuild/output/src317918707/src/oxy/node_modules/@storybook/docs-tools/dist/esm/argTypes/convert/flow/index.js"
                                    (vite:load-fallback) load "/codebuild/output/src317918707/src/oxy/node_modules/@storybook/docs-tools/dist/esm/argTypes/convert/proptypes/index.js"
                                    (vite:load-fallback) load "/codebuild/output/src317918707/src/oxy/node_modules/@storybook/docs-tools/dist/esm/argTypes/docgen/types.js"
                                    (vite:load-fallback) load "/codebuild/output/src317918707/src/oxy/node_modules/@storybook/docs-tools/dist/esm/argTypes/docgen/utils/index.js"
                                    (vite:load-fallback) load "/codebuild/output/src317918707/src/oxy/node_modules/@storybook/docs-tools/dist/esm/argTypes/docgen/extractDocgenProps.js"
                                    (vite:load-fallback) load "/codebuild/output/src317918707/src/oxy/node_modules/@storybook/docs-tools/dist/esm/argTypes/docgen/PropDef.js"
                                    (vite:load-fallback) load "/codebuild/output/src317918707/src/oxy/node_modules/doctrine/lib/doctrine.js"
                                    (vite:load-fallback) load "/codebuild/output/src317918707/src/oxy/node_modules/object-assign/index.js"
                                    (commonjs) load "\u0000/codebuild/output/src317918707/src/oxy/node_modules/object-assign/index.js?commonjs-proxy"
                                    (vite:load-fallback) load "/codebuild/output/src317918707/src/oxy/node_modules/@storybook/addon-links/node_modules/@storybook/csf/dist/story.js"
                                    (commonjs) load "\u0000/codebuild/output/src317918707/src/oxy/node_modules/@storybook/addon-links/node_modules/@storybook/csf/dist/story.js?commonjs-proxy"
                                    (vite:load-fallback) load "/codebuild/output/src317918707/src/oxy/node_modules/uuid-browser/v4.js"
@lostdesign lostdesign added the bug Something isn't working label Mar 31, 2022
@IanVS
Copy link
Member

IanVS commented Mar 31, 2022

I've never worked with amplify before, so I'm not sure how to help troubleshoot this. Can you think of any reasons this might be happening? How would I go about reproducing the issue?

@lostdesign
Copy link
Author

@IanVS let me setup a demo repo and a guide on how to reproduce - either today or by monday. Thanks already

@GuyGooL5
Copy link
Contributor

GuyGooL5 commented Apr 3, 2022

I had a similar issue using react, the problem is that amplify has a bug when importing ESM modules and not CommonJS.

The fix I found recently was aliasing runtimeConfig.browser as runtimeConfig

Try this fix:

add this snippet to your viteFinal function in main.js

...
    resolve : {
      ...config.resolve,
      alias: {
        ...config.resolve?.alias,
        './runtimeConfig': './runtimeConfig.browser',
      },
...

Also add this snippet to your preview.js after imports and before any code execution

window.global = window
(window as any).global = window (typescript)

Edit: spelling

@lostdesign
Copy link
Author

@GuyGooL5 Thanks for the insight, I've tried with the following config and had the same issues still. I assume I did not apply your snippets properly. Can you double check?

main.js

  async viteFinal(config, {configType}) {
    return {
      ...config,
      resolve: {
        ...config.resolve,
        alias: [
          ...config.resolve?.alias,
          {
            './runtimeConfig': './runtimeConfig.browser'
          },
          {
            find: "@",
            replacement: path.resolve(__dirname, "../src"),
          },
          /* https://v3.vuejs.org/guide/installation.html#for-server-side-rendering */
          {
            find: "vue",
            replacement: path.resolve(__dirname, "../node_modules/vue/dist/vue.esm-bundler.js"),
          },
        ],
      },
    };
  },

preview.js

import '../src/assets/tailwind.css'

window.global = window
(window as any).global = window

export const parameters = {
actions: { argTypesRegex: "^on[A-Z].*" },
controls: {
  matchers: {
    color: /(background|color)$/i,
    date: /Date$/,
  },
},
}

@GuyGooL5
Copy link
Contributor

GuyGooL5 commented Apr 4, 2022

hmm... I'm actually not familiar with config.resolve.alias being an array so my intuitive suggestion would be replacing

          {
            './runtimeConfig': './runtimeConfig.browser'
          },

with

          {
            find: "./runtimeConfig",
            replacement: "./runtimeConfig.browser",
          },

now about the preview.js file, the line (window as any).global = window is redundant as it was intended to be implemented in a .ts file so it can be removed.

@GuyGooL5
Copy link
Contributor

GuyGooL5 commented Apr 5, 2022

@lostdesign can you let me know if the problem was fixed?

@lostdesign
Copy link
Author

@GuyGooL5 I will be checking this later today and post an update.

@lostdesign
Copy link
Author

@GuyGooL5 nothing changed.

Was required to remove ...config.resolve?.alias as that would throw not an interatable when building locally.

  async viteFinal(config, {configType}) {
    return {
      ...config,
      resolve: {
        ...config.resolve,
        alias: [
          //...config.resolve?.alias,
          {
            find: "./runtimeConfig",
            replacement: "./runtimeConfig.browser",
          },
          {
            find: "@",
            replacement: path.resolve(__dirname, "../src"),
          },
          /* https://v3.vuejs.org/guide/installation.html#for-server-side-rendering */
          {
            find: "vue",
            replacement: path.resolve(__dirname, "../node_modules/vue/dist/vue.esm-bundler.js"),
          },
        ],
      },
    };
  },

preview.js is the same as before, minus the typed window.

Error: Error: Cannot find module '@storybook/core-common'

@dpschen
Copy link

dpschen commented Apr 5, 2022

@lostdesign I was able to work around based on the snippet above, see: storybookjs/storybook#17844 (comment).
I also needed to remove ...config.resolve?.alias

I think the issue is related to this: storybookjs/storybook#17875

EDIT:

window.global = window was not even necessary in preview.js.

@lostdesign
Copy link
Author

@dpschen thanks for the headsup! Cannot quite apply the same logic for this package I guess or at least I don't know how I'd need to apply it.

Since there is no @storybook/core/common or is there?

@IanVS
Copy link
Member

IanVS commented Apr 5, 2022

You would need to use something like https://www.npmjs.com/package/patch-package to change the file in node_modules the same way that is done in that PR. Or, wait for the next alpha version to be released, which should also fix that particular issue.

@dpschen
Copy link

dpschen commented Apr 5, 2022

@lostdesign I'm using the storybook packages with version 6.5.0-alpha.55.
I had the same issue as you (aka core-common file) before with previous versions.

EDIT: That also fixed issues that I had with vite 2.9.

@lostdesign
Copy link
Author

I think at best I will just wait. It works on vercel meanwhile and things probably get resolved rather soon.

@IanVS
Copy link
Member

IanVS commented Apr 5, 2022

There's a new 6.5.0-alpha.56 version of storybook which should solve the "forced commonjs import" issue mentioned above. It might be worth trying, but I'm not certain whether that was causing your issues or not.

@lostdesign
Copy link
Author

I will be trying tomorrow morning and report back with any findings.

@IanVS
Copy link
Member

IanVS commented Apr 6, 2022

Turns out that version alpha.56 might not be sufficient. I think that storybookjs/storybook#17875 is needed to fix the issue after all.

@b3nab
Copy link

b3nab commented Feb 13, 2023

This issue is similar to #559 and there is the same error: error TS2792: Cannot find module '@storybook/core-common' even if the module is installed on local project.

Someone know how to solve this issue?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

5 participants