'default' is not exported by babel-runtime define-property.js

[AlonMiz]

trying to build storybook (i can watch storybook which is a milestone we achieved)
getting this error.
some of my components do actually load babel-runtime (like https://github.com/react-component/calendar and others). so I can't just bump to @babel/runtime. not sure even if it will help.
that's might related to how rollup bundles common js modules. but I'm not sure.

'default' is not exported by node_modules/babel-runtime/node_modules/core-js/library/fn/object/define-property.js?commonjs-proxy, imported by ../node_modules/babel-runtime/core-js/object/define-property.js
file: node_modules/babel-runtime/core-js/object/define-property.js:4:7
2: import { __module as definePropertyModule, exports as defineProperty } from "\u0000node_modules/babel-runtime/core-js/object/define-property.js?commonjs-module"
3: import "\u0000core-js/library/fn/object/define-property?commonjs-require";
4: import require$$0 from "\u0000core-js/library/fn/object/define-property?commonjs-proxy";
^
5:
6: (function (module) {
  ERR! Error: 'default' is not exported by node_modules/babel-runtime/node_modules/core-js/library/fn/object/define-property.js?commonjs-proxy, imported by ../node_modules/babel-runtime/core-js/object/define-property.js
  ERR!     at error (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:158:30)
  ERR!     at Module.error (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:12382:16)
  ERR!     at Module.traceVariable (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:12767:29)
  ERR!     at ModuleScope.findVariable (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:11559:39)
  ERR!     at FunctionScope.findVariable (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:6930:38)
  ERR!     at ChildScope.findVariable (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:6930:38)
  ERR!     at Identifier.bind (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:6419:40)
  ERR!     at Property.bind (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:5025:23)
  ERR!     at ObjectExpression.bind (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:5021:31)
  ERR!     at AssignmentExpression.bind (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:5025:23)
  ERR!     at ExpressionStatement.bind (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:5025:23)
  ERR!     at BlockStatement.bind (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:5021:31)
  ERR!     at FunctionExpression.bind (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:5025:23)
  ERR!     at CallExpression.bind (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:5025:23)
  ERR!     at CallExpression.bind (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:9396:15)
  ERR!     at ExpressionStatement.bind (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:5025:23)
  ERR!  Error: 'default' is not exported by node_modules/babel-runtime/node_modules/core-js/library/fn/object/define-property.js?commonjs-proxy, imported by ../node_modules/babel-runtime/core-js/object/define-property.js
  ERR!     at error (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:158:30)
  ERR!     at Module.error (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:12382:16)
  ERR!     at Module.traceVariable (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:12767:29)
  ERR!     at ModuleScope.findVariable (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:11559:39)
  ERR!     at FunctionScope.findVariable (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:6930:38)
  ERR!     at ChildScope.findVariable (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:6930:38)
  ERR!     at Identifier.bind (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:6419:40)
  ERR!     at Property.bind (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:5025:23)
  ERR!     at ObjectExpression.bind (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:5021:31)
  ERR!     at AssignmentExpression.bind (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:5025:23)
  ERR!     at ExpressionStatement.bind (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:5025:23)
  ERR!     at BlockStatement.bind (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:5021:31)
  ERR!     at FunctionExpression.bind (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:5025:23)
  ERR!     at CallExpression.bind (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:5025:23)
  ERR!     at CallExpression.bind (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:9396:15)
  ERR!     at ExpressionStatement.bind (node_modules/vite/node_modules/rollup/dist/shared/rollup.js:5025:23) {
    ERR!   code: 'MISSING_EXPORT',
      ERR!   url: 'https://rollupjs.org/guide/en/#error-name-is-not-exported-by-module',
      ERR!   id: 'node_modules/babel-runtime/core-js/object/define-property.js',
      ERR!   pos: 336,
      ERR!   loc: {
      ERR!     column: 7,
        ERR!     file: 'node_modules/babel-runtime/core-js/object/define-property.js',
        ERR!     line: 4
      ERR!   },
    ERR!   frame: '2: import { __module as definePropertyModule, exports as defineProperty } from "\\u0000node_modules/babel-runtime/core-js/object/define-property.js?commonjs-module"\n' +
    ERR!     '3: import "\\u0000core-js/library/fn/object/define-property?commonjs-require";\n' +
    ERR!     '4: import require$$0 from "\\u0000core-js/library/fn/object/define-property?commonjs-proxy";\n' +
    ERR!     '          ^\n' +
    ERR!     '5: \n' +
    ERR!     '6: (function (module) {',
      ERR!   watchFiles: [
      ERR!     'storybook/iframe.html',
      ERR!     '/virtual:/@storybook/builder-vite/vite-app.js',
      ERR!     'vite/modulepreload-polyfill',
      ERR!     'node_modules/@storybook/react/dist/esm/client/index.js',
      ERR!     'node_modules/@storybook/client-api/dist/esm/index.js',
      ERR!     ... 2676 more items
      ERR!   ]
    ERR! }

using the latest vite and storybook-builder-vite and storybook "6.4.0-beta.25"

[IanVS]

Oh man, I had problems with babel-runtime in the past as well. The only way I found to fix it in my case was to submit a pull request to a package to update their dependency to one that didn't use babel/runtime.

Your app compiles/builds correctly in vite without storybook? Sorry I don't have a good answer, but it does indeed seem to be something funky that babel-runtime and/or core-js are doing that rollup doesn't like.

[AlonMiz]

@IanVS .
yes, it does compiles with vite, without storybook. we have too many of these old "react-components" using babel-runtime, that's sad :/
I wasn't able to understand what's the exact issue. my guess was that the rollup doesn't want to treat it as commonjs and not compiling it, as it's a dependency. and I couldn't make it to forcely compile...

[cain-wang]

Hi, I'm curious if we have any updates on that?
We were able to get storybook local development working, but build-storybook still fails with similar errors.

'default' is not exported by xxx/node_modules/babel-runtime/node_modules/core-js/library/fn/object/keys.js?commonjs-proxy, imported by node_modules/babel-runtime/core-js/object/keys.js
xxx/node_modules/babel-runtime/core-js/object/keys.js:4:7
2: import { __module as keysModule, exports as keys } from "xxx/node_modules/babel-runtime/core-js/object/keys.js?commonjs-module"
3: import "\u0000core-js/library/fn/object/keys?commonjs-require";
4: import require$$0 from "\u0000core-js/library/fn/object/keys?commonjs-proxy";
          ^
5:
6: (function (module) {

[ZeekoZhu]

I finally find a workaround for this issue. I'm using [email protected], which has babel-runtime as a dependency, and this issue occurs.

1. add core-js and other cjs modules to optimizeDeps

const { glob } = require('glob');

// we need to upgrade lingui to 3.x to remove the following config, they all come from lingui 2.x
const coreJsFiles = glob.sync('node_modules/core-js/modules/*.js').map(it => it.substring('node_modules/'.length));
const optimizeDeps = ['hoist-non-react-statics', ...coreJsFiles, '@lingui/core', '@lingui/react'];

2. remove mock-core-js plugin

  viteFinal: async (config) => {
    if (config.optimizeDeps) {
      config.optimizeDeps.include.push(...optimizeDeps);
    } else {
      config.optimizeDeps = {
        include: optimizeDeps
      };
    }
    // remove the built-in mock-core-js
    const plugins = config.plugins.filter((_, i) => i !== 1);
    config.plugins = plugins;
   // other configs
    return config;
  },

[AlonMiz]

@ZeekoZhu worked for me. thanks!

[IanVS]

Thanks everyone. A fix for this has been released in @storybook/builder-vite 0.2.1. You can remove the workaround from your vite config once you upgrade. And please let us know if you hit any problems.

[AlonMiz]

Thanks @IanVS will try that soon