Storybook: Storybook v5 s'interrompt lors de l'utilisation de core-js ^ 3.0

Storybook n'utilise pas correctement core-js. @babel/preset-env version 7.4.1 mise à niveau vers core-js@3 et cela a cassé mon application de réaction Storybook lors de l'exécution de tests

client-api semble devoir avoir core-js @ 2 comme dépendance car le core généré l'exige

Bien qu'il dise qu'il est corrigé avec 5.0.4 et 5.0.5, j'obtiens toujours cette erreur.

Comment reproduire:
Installez @storybook/cli et le package init. Puis lancez le livre d'histoires avec npx -p @storybook/cli sb init --type react .

➜  my-prj npx -p @storybook/cli sb init --type react
npx: installed 404 in 11.526s

WARNING: We noticed you're using the `useBuiltIns` option without declaring a core-js version. Currently, we assume version 2.x when no version is passed. Since this default version will likely change in future versions of Babel, we recommend explicitly setting the core-js version you are using via the `corejs` option.

You should also be sure that the version you pass to the `corejs` option matches the version specified in your `package.json`'s `dependencies` section. If it doesn't, you need to run one of the following commands:

  npm install --save core-js<strong i="11">@2</strong>    npm install --save core-js<strong i="12">@3</strong>
  yarn add core-js<strong i="13">@2</strong>              yarn add core-js<strong i="14">@3</strong>

[BABEL] Note: The code generator has deoptimised the styling of /Users/lumio/.npm/_npx/74147/lib/node_modules/@storybook/cli/node_modules/lodash/lodash.js as it exceeds the max of 500KB.

 sb init - the simplest way to add a storybook to your project.

 • Installing Storybook for user specified project type. ✓
 • Adding storybook support to your "React" app. ✓
 • Preparing to install dependencies. ✓


> [email protected] install ./my-prj/node_modules/fsevents
> node install

node-pre-gyp WARN Using needle for node-pre-gyp https download
[fsevents] Success: "./my-prj/node_modules/fsevents/lib/binding/Release/node-v64-darwin-x64/fse.node" is installed via remote
npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN [email protected] No description
npm WARN [email protected] No repository field.

added 1160 packages from 900 contributors in 23.386s

 • Installing dependencies. ✓

To run your storybook, type:

   npm run storybook

For more information visit: https://storybook.js.org

➜  my-prj nvim .
➜  my-prj yarn storybook
yarn run v1.15.2
$ start-storybook -p 6006
info @storybook/react v5.0.5
info
info => Loading presets
info => Loading presets
info => Loading custom addons config.
info => Using default webpack setup.
info => Using base config because react-scripts is not installed.
 10% building 5/8 modules 3 active ...j/node_modules/querystring-es3/index.js
WARNING: We noticed you're using the `useBuiltIns` option without declaring a core-js version. Currently, we assume version 2.x when no version is passed. Since this default version will likely change in future versions of Babel, we recommend explicitly setting the core-js version you are using via the `corejs` option.

You should also be sure that the version you pass to the `corejs` option matches the version specified in your `package.json`'s `dependencies` section. If it doesn't, you need to run one of the following commands:

  npm install --save core-js<strong i="15">@2</strong>    npm install --save core-js<strong i="16">@3</strong>
  yarn add core-js<strong i="17">@2</strong>              yarn add core-js<strong i="18">@3</strong>

 11% building 13/18 modules 5 active ...my-prj/node_modules/strip-ansi/index.js
WARNING: We noticed you're using the `useBuiltIns` option without declaring a core-js version. Currently, we assume version 2.x when no version is passed. Since this default version will likely change in future versions of Babel, we recommend explicitly setting the core-js version you are using via the `corejs` option.

You should also be sure that the version you pass to the `corejs` option matches the version specified in your `package.json`'s `dependencies` section. If it doesn't, you need to run one of the following commands:

  npm install --save core-js<strong i="19">@2</strong>    npm install --save core-js<strong i="20">@3</strong>
  yarn add core-js<strong i="21">@2</strong>              yarn add core-js<strong i="22">@3</strong>

webpack built 896edc3c5271d2618768 in 4031ms
╭──────────────────────────────────────────────────╮
│                                                  │
│   Storybook 5.0.5 started                        │
│   4.71 s for manager and 4.48 s for preview      │
│                                                  │
│   Local:            http://localhost:6006/       │
│   On your network:  http://10.52.40.112:6006/    │
│                                                  │
╰──────────────────────────────────────────────────╯

@lumio Ce n'est pas une erreur, c'est un avertissement. Il est corrigé dans 5.1.0-alpha.16 et je publierai le correctif dans latest après qu'il soit sorti pendant quelques jours si personne ne se plaint.

Je l'ai! Merci!

J'ai mis à niveau la version du livre d'histoires vers la version 5.0.6 et cela a résolu ce problème.

@ jessy1092 Super de l'entendre. Je ferme ça pour l'instant. Si quelqu'un rencontre à nouveau ce problème, je rouvrirai.

Bonjour,
Cela ne semble pas fonctionner pour moi, même avec le livre d'histoires 5.1.0-alpha.18

Voici un repo reproductible: https://github.com/christophehurpeau/cra-rest-hooks-storybook

yarn install
yarn storybook

J'espère que ça aide

@christophehurpeau Avez -vous une chance d'essayer 5.0.6 pour moi? Rouvrir ceci. 😭

Je suis toujours tombé sur le même problème en utilisant core-js @ v3 dans mon projet principal. La solution était de s'assurer que dans la configuration du webpack, que core-js/modules est résolu dans la version fournie avec le livre d'histoires

resolve: {
    alias: {
        'core-js/modules': path.resolve(
            __dirname,
            'node_modules/@storybook/core/node_modules/core-js/modules',
        ),
    }
}

Solution Hacky mais devrait être assez bonne pour le moment.

@shilman a également essayé 5.0.6, même résultat (https://github.com/christophehurpeau/cra-rest-hooks-storybook/tree/storybook-5.0.6)

@artursvonda Je n'utilise pas core-js v3, une dépendance l'utilise. Je n'ai pas node_modules/@storybook/core/node_modules/core-js car la v2 est celle utilisée à la fois par react-scripts et @ storybook / core, dédoublée dans node_modules. Seule la dépendance utilisant core-js 3 ne trouve pas core-js

ah donc ça marche quand je supprime l'alias:

module.exports = ({ config, mode }) => {
  console.log(config.resolve.alias);
  delete config.resolve.alias['core-js'];
  return config;
};

sensationnel. les alias sont effrayants. pourquoi les livres de contes les utilisent-ils?

cc @ndelangen

J'ai ce problème aussi. J'utilise la dernière base de feu qui a récemment ajouté une dépendance à core-js @ 3 .
après la mise à niveau de Firebase, le livre d'histoires utilisé pour exécuter produit les erreurs suivantes:

ERROR in ./node_modules/@firebase/polyfill/dist/index.esm.js
Module not found: Error: Can't resolve 'core-js/features/array/find' in '/Users/jin/kinyapp/node_modules/@firebase/polyfill/dist'
 @ ./node_modules/@firebase/polyfill/dist/index.esm.js 3:0-37
 @ ./node_modules/firebase/app/dist/index.cjs.js
 @ ./src/firebase.js
 @ ./src/components/Login.js
 @ ./src/stories/index.js
 @ ./.storybook/config.js
 @ multi ./node_modules/@storybook/core/dist/server/common/polyfills.js ./node_modules/@storybook/core/dist/server/preview/globals.js ./.storybook/config.js ./node_modules/webpack-hot-middleware/client.js?reload=true

ERROR in ./node_modules/@firebase/polyfill/dist/index.esm.js
Module not found: Error: Can't resolve 'core-js/features/array/find-index' in '/Users/jin/kinyapp/node_modules/@firebase/polyfill/dist'
 @ ./node_modules/@firebase/polyfill/dist/index.esm.js 4:0-43
 @ ./node_modules/firebase/app/dist/index.cjs.js
 @ ./src/firebase.js
 @ ./src/components/Login.js
 @ ./src/stories/index.js
 @ ./.storybook/config.js
 @ multi ./node_modules/@storybook/core/dist/server/common/polyfills.js ./node_modules/@storybook/core/dist/server/preview/globals.js ./.storybook/config.js ./node_modules/webpack-hot-middleware/client.js?reload=true

ERROR in ./node_modules/@firebase/polyfill/dist/index.esm.js
Module not found: Error: Can't resolve 'core-js/features/object/assign' in '/Users/jin/kinyapp/node_modules/@firebase/polyfill/dist'
 @ ./node_modules/@firebase/polyfill/dist/index.esm.js 5:0-40
 @ ./node_modules/firebase/app/dist/index.cjs.js
 @ ./src/firebase.js
 @ ./src/components/Login.js
 @ ./src/stories/index.js
 @ ./.storybook/config.js
 @ multi ./node_modules/@storybook/core/dist/server/common/polyfills.js ./node_modules/@storybook/core/dist/server/preview/globals.js ./.storybook/config.js ./node_modules/webpack-hot-middleware/client.js?reload=true

peut confirmer,

// In some story or dependency of a story
import firebase from "firebase/app"

dans un nouveau cra2 et sb init plante

Même problème pour moi. Revenir à la version firebase 4.12.1 fonctionné mais il a plus d'un an et n'est pas une bonne solution.

ah donc ça marche quand je supprime l'alias:

module.exports = ({ config, mode }) => {
  console.log(config.resolve.alias);
  delete config.resolve.alias['core-js'];
  return config;
};

L'utilisation de [email protected] avec [email protected] et l'ajout de ceci à .storybook/webpack.config.js résolu le problème.

Je viens de voir que Firebase avait une mise à jour vers 5.10.0 et aussi mis à jour le livre de contes vers 5.0.10 , et j'ai pu supprimer l'alias "hack" ci-dessus.

Malheureusement, la mise à jour de Firebase et du livre d'histoires à la dernière version n'a pas résolu mon problème.
Je dois arrêter d'utiliser le livre d'histoires pour ce numéro.

@zjaml avez-vous essayé les solutions de contournement de @parkerholladay ci-dessus?

@shilman à ce sujet, je ne sais pas dans quel fichier je dois le faire.

@zjaml C'est .storybook/webpack.config.js . S'il vous plaît laissez-moi savoir si cela fonctionne pour vous!

@shilman ça marche comme ça! Merci!

J'utilise babel preset-env et j'ai rencontré le même problème avec storybook 5.0.10

"useBuiltIns": "usage",
"corejs": {version: 3},

La solution de contournement de suppression d'alias l'a corrigé pour moi. 🙏 @christophehurpeau

Devrions-nous supprimer l'alias du webpack.config de l'aperçu?

peut-être même tous les alias?

Même problème ici, l'alias de suppression ne résout pas le problème pour moi :(

Même problème pour moi. La suppression de l'alias ne résout pas le problème

Ce PR abordera ce problème et bien d'autres, je pense:
https://github.com/storybooks/storybook/pull/6566

C'est probablement un changement majeur, donc il pourrait être livré en V6, nous en débattons toujours.

Nous pouvons peut-être consacrer un peu de temps à diviser ce PR en plusieurs PR afin de pouvoir fusionner et publier certaines choses plus rapidement.

L'aide serait beaucoup appréciée!

Même problème ici - le nôtre est en train de rompre avec react-app-polyfill qui a été mis à jour pour utiliser la version 3. core-js .

Confirmant cette solution a fonctionné pour moi aussi, [email protected] et [email protected]

ajouté le fichier ./storybook/webpack.config.js avec ce qui précède

~ désolé - @ storybook /

EDIT: Désolé - fini de trouver la réponse dans un autre problème. https://github.com/storybooks/storybook/issues/5893

solution de contournement
Utilisez la prochaine version du natif CLI / React pour obtenir 5.1.0-alpha.x:

npx -p @ storybook / cli @ next sb init --type react_native

La suppression de l'alias n'a pas fonctionné pour moi. Cependant, j'ai pu contourner ce problème en déplaçant notre fichier babel dans .storybook

Salut à tous! On dirait qu'il n'y a pas eu grand-chose dans ce numéro ces derniers temps. S'il y a encore des questions, des commentaires ou des bugs, n'hésitez pas à poursuivre la discussion. Malheureusement, nous n'avons pas le temps d'aborder tous les problèmes. Nous sommes toujours ouverts aux contributions, veuillez donc nous envoyer une demande de tirage si vous souhaitez aider. Les problèmes inactifs seront fermés après 30 jours. Merci!

^ À ma connaissance, c'est toujours un problème et ne doit pas être marqué comme inactif

@jdhayford AFAIK ceci est corrigé dans la version 5.1, qui devrait sortir dans quelques jours

@shilman C'est super! Merci et merci aux contributeurs 👍

Ce problème est toujours en cours, mais a pu le résoudre à l'aide de la solution @brycehill

La suppression de l'alias n'a pas fonctionné pour moi. Cependant, j'ai pu contourner ce problème en déplaçant notre fichier babel dans .storybook

Je suis toujours confronté au même problème. @ByDesignGit Pouvez-vous s'il vous plaît expliquer comment avez-vous pu résoudre ce problème?

A été en mesure de corriger en installant manuellement le dernier npm i core-js -D.
Il n'est pas bon d'installer manuellement une dépendance. il doit gérer correctement ces problèmes en interne.

En attente de la solution appropriée.

J'ai également rencontré le même problème. Cependant, je pense que c'est maintenant le contraire du problème d'origine où un package précédent installait une ancienne version de core-js (2.6.9) en tant que dépendance et que le livre de contes nécessite maintenant core-js @ 3.
Correction provisoire à l'aide de la solution

Je suis toujours confronté au même problème. @ByDesignGit Pouvez-vous s'il vous plaît expliquer comment avez-vous pu résoudre ce problème?

je l'ai résolu en déplaçant mon .babelrc dans mon .storybook

Ce problème est toujours en cours, mais a pu le résoudre à l'aide de la solution @brycehill

La suppression de l'alias n'a pas fonctionné pour moi. Cependant, j'ai pu contourner ce problème en déplaçant notre fichier babel dans .storybook

Même chose ici:

ERROR in ./.storybook/config.js
Module not found: Error: Can't resolve 'core-js/modules/es.array.for-each' in '/indio-ui/.storybook'
 @ ./.storybook/config.js 1:0-43
 @ multi ./node_modules/@storybook/core/dist/server/common/polyfills.js ./node_modules/@storybook/core/dist/server/preview/globals.js ./.storybook/config.js ./node_modules/webpack-hot-middleware/client.js?reload=true

La suppression de l'alias n'a pas fonctionné pour moi. Mais j'ai installé npm i core-js -D comme @ChandanPHAI l'a suggéré, et cela a fonctionné 👌

En attente de la bonne solution également.

Je suis toujours confronté au même problème. @ByDesignGit Pouvez-vous s'il vous plaît expliquer comment avez-vous pu résoudre ce problème?

je l'ai résolu en déplaçant mon .babelrc dans mon .storybook

Ce problème est toujours en cours, mais a pu le résoudre à l'aide de la solution @brycehill

La suppression de l'alias n'a pas fonctionné pour moi. Cependant, j'ai pu contourner ce problème en déplaçant notre fichier babel dans .storybook

Ça a marché! J'ai copié .babelrc dans .storybook

@ arvenz0210 @ByDesignGit cela ne signifie-t-il pas que vous devez maintenant maintenir deux fichiers .babelrc ? Cela semble indésirable.

La mise à niveau de mon projet vue.js vers "@storybook/vue": "^5.1.1" résolu le problème d'alias core-js pour moi. 👍

• pas besoin de déplacer mon babel.config.js
• n'a pas besoin d'ajouter / supprimer quoi que ce soit de ma configuration webpack (j'utilise https://github.com/storybookjs/vue-cli-plugin-storybook v0.6.1 donc ma configuration webpack est en partie générée par vue-cli avec un peu de trucs sans rapport, j'ai ajouté via vue.config.js que vue-cli fusionne avec la configuration webpack générée dynamiquement.)
• n'a pas besoin d'ajouter / supprimer des références aux core-js, alias ou deps qui dépendent de core-js, etc ...

Je vois également cela sur un projet Angular, donc pas de fichier .babel. Pas de chance avec l'installation séparée de core-js ou la suppression d'alias.

//  console.log(config.resolve.alias);
{
  'babel-runtime/core-js/object/assign': '/Development/canopy/node_modules/@storybook/core/node_modules/core-js/es/object/assign.js',
  react: '~/Development/canopy/node_modules/react',
  'react-dom': '/Development/canopy/node_modules/react-dom'
}

Toutes les révisions à 5.1.1.

   "@storybook/addon-actions": "^5.1.1",
    "@storybook/addon-knobs": "^5.1.1",
    "@storybook/addon-notes": "^5.1.1",
    "@storybook/addon-viewport": "^5.1.1",
    "@storybook/addons": "^5.1.1",
    "@storybook/angular": "^5.1.1",

Toutes mes excuses, je n'ai pas eu le temps de déboguer davantage.

Utilisation de @storybook/react": "^5.1.1" et obtenant toujours ce problème avec un nouveau npm install . Je soupçonne que @ChandanPHAI est correct, j'ai d'autres dépendances qui ont installé la v2 du package core-js .

Ce PR est fait aujourd'hui devrait résoudre ce problème, @shilman fera

Toujours en cours avec "@storybook/react": "^5.1.3" - L'installation de core-js --dev résolu le problème de mon côté.

toute personne confrontée à un problème https://github.com/storybookjs/storybook/issues/7021 ??

Hourra!! Je viens de publier https://github.com/storybookjs/storybook/releases/tag/v5.1.4 contenant PR # 7016 qui fait référence à ce problème. Mettez à niveau dès aujourd'hui pour l'essayer!

Clôture de ce numéro. Veuillez rouvrir si vous pensez qu'il reste encore beaucoup à faire.

@shilman vient de se

Module not found: Error: Can't resolve 'core-js/modules/web.dom-collections.iterator'

@shilman J'ai mis à jour le livre de contes et les addons avec la dernière version.

Obtention toujours des erreurs liées à core-js.

l'installation de npm i core-js -D résout le problème localement.

sans la bibliothèque core-js, cela ne fonctionne pas.

Importez-vous babel-polyfill n'importe où dans votre code? Si oui, essayez de le supprimer?

Voici comment j'ai corrigé la branche de repro que j'ai obtenue:
https://github.com/umakantp/demo-repro/pull/1

Veuillez m'envoyer plus de dépôts de repro via n'importe quel canal, afin que je puisse résoudre le problème.

@ChandanPHAI @DonikaV

@ndelangen salut, je n'ai pas babel-polyfill dans mon dossier. Je ne peux pas vous en montrer plus. C'est un repo privé.
le livre de contes et tous les addons ont été mis à jour.

Salut, rencontrant le même problème avec core-js même sur 5.1.4. L'installation manuelle de core-js en tant que dépendance dev ne fonctionnait pas non plus.

J'y travaille, nouvelle version sous 24h!

Yee-haw !! Je viens de publier https://github.com/storybookjs/storybook/releases/tag/v5.1.5 contenant PR # 7086 qui fait référence à ce problème. Mettez à niveau dès aujourd'hui pour l'essayer!

Clôture de ce numéro. Veuillez rouvrir si vous pensez qu'il reste encore beaucoup à faire.

Je reçois toujours des erreurs pour presque tous les composants que j'ai, comme les suivants:

ERROR in ./src/components/list/VirtualizedList.jsx
Module not found: Error: Cannot find module 'C:\ProjectDirectory\node_modules\@storybook\addon-storysource\loader.js!C:\ProjectDirectory\node_modules\core-js\modules\web.dom-collections.iterator.js'
 @ ./src/components/list/VirtualizedList.jsx 19:0-54
 @ ./src/components/list/index.js
 @ ./src/components/list/List.story.jsx
 @ ./src/components sync story\.jsx?$
 @ ./.storybook/config.js
 @ multi ./node_modules/@storybook/core/dist/server/common/polyfills.js ./node_modules/@storybook/core/dist/server/preview/globals.js ./.storybook/config.js (webpack)-hot-middleware/client.js?reload=true

Je n'exclus pas cela peut être ma faute. J'ai clané le cache de fil, supprimé yarn.lock, installé la dernière version de chaque dépendance. Je n'ai pas installé core-js en tant que dépendance mais j'utilise babel avec des préréglages comme @babel/preset-env . J'ai une configuration Webpack personnalisée:

const path = require('path');
const { DefinePlugin } = require('webpack');

const buildTimeConfig = require('../buildTimeConfig');

const resolveLocalDirectory = relativePath => path.resolve(__dirname, '../', relativePath);

module.exports = async ({ config }) => {
  config.resolve.extensions.push('.jsx');
  config.resolve.extensions.push('.json');

  config.plugins.push(
    new DefinePlugin({
      SUPPORTED_LOCALES: `'${buildTimeConfig.REQUIRED_LOCALES}'`,
    }),
  );

  config.resolve.alias = {
    $components: resolveLocalDirectory('src/components'),
  };

  config.module.strictExportPresence = true;

  config.module.rules.push({
    test: /\.jsx?$/,
    loaders: [require.resolve('@storybook/addon-storysource/loader')],
    enforce: 'pre',
  });

  // Unsafe override of css-modules rule for the following
  // https://github.com/storybooks/storybook/issues/6083.
  config.module.rules[2] = {
    oneOf: [
      {
        test: /\.module\.(scss|css)$/,
        use: [
          'style-loader',
          {
            loader: 'css-loader',
            options: {
              localsConvention: 'camelCaseOnly',
              importLoaders: 1,
              modules: {
                localIdentName: '[local]_[hash:5]',
              },
              sourceMap: true,
            },
          },
          'sass-loader',
        ],
      },
      {
        test: /(?<!\.module)\.(scss|css)$/,
        use: [
          'style-loader',
          {
            loader: 'css-loader',
            options: {
              importLoaders: 1,
              sourceMap: true,
            },
          },
          'sass-loader',
        ],
      },
      {
        test: /\.json$/,
        include: /node_modules\/emoji-dictionary/,
        loader: 'json-loader',
      },
      {
        exclude: /\.(js|jsx|ejs|html|json|md)$/,
        loader: 'file-loader',
        options: { name: 'assets/[name].[ext]' },
      },
    ],
  };

  return config;
};

@filippoitaliano J'ai exactement la même erreur. Je peux confirmer que le fichier est présent dans le chemin des modules core-js et que le préréglage babel a activé core-js 3, mais échoue toujours. Avez-vous réussi à résoudre ce problème?

Éditer:

Si je supprime addon-storysource, fonctionne comme prévu. Je ne sais pas ce qui cause cela.

Modifier 2:
Creusé plus profondément. Pour une raison quelconque, le chargeur de storysource a besoin de tous les fichiers .js pour apparaître dans le panneau de l'addon, et a dû exclure les modules de nœuds dans la configuration

{
test: /\.js$/,
exclude: /node_modules/,
loaders: [require.resolve('@storybook/addon-storysource/loader')],
enforce: 'pre',
}

Peut-être lié à # 3626 # 6984

cc @ igor-dv @libetl ☝️

@ aga5tya Ouais, tu as touché le problème. J'ai exclu node_modules et tout fonctionne bien!

J'ai dû:

• [x] mettre à jour toutes les dépendances @ storybook / *
• [x] ajouter "corejs": 3 à mon .babelrc
• [x] exécuter yarn add corejs@3
• [x] ajouter exclude: /node_modules/, à mon webpack.config.js
• [x] supprimer import 'babel-polyfill' de mon app.js

babel polyfill est obsolète et doit être remplacé par core-js partout

ou airbnb-browser-shims :-p

dans tous les cas, node_modules doit toujours être exclu de la transpilation.

J'ai l'erreur suivante:

ERREUR dans ./.storybook/config.js
Module non trouvé: Erreur: Impossible de trouver le module 'core-js / modules / web.dom.iterable'

J'utilise storybook / vue 5.1.9.

@flowck veuillez installer core-js v3 dans la racine de votre projet

Pouvons-nous trouver un moyen d'utiliser Storybook sans aucun core-js en cours d'utilisation? Pourquoi les consommateurs ne peuvent-ils pas fournir leurs propres cales?

babel-polyfills est un dépôt d'une bibliothèque que je dois utiliser. Comment puis-je exécuter un livre d'histoires dans ce cas?

J'ai couru yarn upgrade interactive --latest , mis à jour toutes les dépendances liées aux livres d'histoires et maintenant ça marche! 🎉

FYI: Cette erreur ne s'est produite qu'après avoir ajouté l'addon @storybook/addon-knobs .

@ chadlavi-casebook uhm, vous pourriez essayer d'ajouter un plugin d'ignorer le webpack je suppose?
https://webpack.js.org/plugins/ignore-plugin/

J'ai eu le même problème avec @ storybook / vue 5.1.9. L'exécution de yarn why core-js s'est avérée ceci:

=> Found "[email protected]"
info Has been hoisted to "core-js"
info Reasons this module exists
   - "workspace-aggregator-20eaddfd-71c7-48bf-a12d-ecca73d8226d" depends on it
   - Hoisted from "_project_#@storybook#addon-knobs#core-js"
   - Hoisted from "_project_#@storybook#addon-viewport#core-js"
   - Hoisted from "_project_#@storybook#vue#core-js"
   - Hoisted from "_project_#core-js"
   - Hoisted from "_project_#@storybook#addon-knobs#@storybook#addons#core-js"
   - Hoisted from "_project_#@storybook#addon-knobs#@storybook#client-api#core-js"
   - Hoisted from "_project_#@storybook#addon-viewport#@storybook#client-logger#core-js"
   - Hoisted from "_project_#@storybook#addon-knobs#@storybook#components#core-js"
   - Hoisted from "_project_#@storybook#addon-knobs#@storybook#core-events#core-js"
   - Hoisted from "_project_#@storybook#vue#@storybook#core#core-js"
   - Hoisted from "_project_#@storybook#addon-knobs#@storybook#theming#core-js"
   - Hoisted from "_project_#@storybook#addon-knobs#@storybook#addons#@storybook#api#core-js"
   - Hoisted from "_project_#@storybook#vue#@storybook#core#@storybook#channel-postmessage#core-js"
   - Hoisted from "_project_#@storybook#addon-knobs#@storybook#addons#@storybook#channels#core-js"
   - Hoisted from "_project_#@storybook#vue#@storybook#core#@storybook#node-logger#core-js"
   - Hoisted from "_project_#@storybook#addon-knobs#@storybook#client-api#@storybook#router#core-js"
   - Hoisted from "_project_#@storybook#vue#@storybook#core#@storybook#ui#core-js"
   - Hoisted from "_project_#@storybook#vue#@storybook#core#lazy-universal-dotenv#core-js"
   - Hoisted from "_project_#@storybook#addon-knobs#@storybook#components#simplebar-react#simplebar#core-js"
info Disk size without dependencies: "6.69MB"
info Disk size with unique dependencies: "6.69MB"
info Disk size with transitive dependencies: "6.69MB"
info Number of shared dependencies: 0
=> Found "@vue/babel-preset-app#[email protected]"
info This module exists because "_project_#@vue#cli-plugin-babel#@vue#babel-preset-app" depends on it.
info Disk size without dependencies: "7.68MB"
info Disk size with unique dependencies: "7.68MB"
info Disk size with transitive dependencies: "7.68MB"
info Number of shared dependencies: 0
=> Found "@babel/runtime-corejs2#[email protected]"
info This module exists because "_project_#@vue#cli-plugin-babel#@vue#babel-preset-app#@babel#runtime-corejs2" depends on it.
info Disk size without dependencies: "7.68MB"
info Disk size with unique dependencies: "7.68MB"
info Disk size with transitive dependencies: "7.68MB"
info Number of shared dependencies: 0
=> Found "fbjs#[email protected]"
info This module exists because "_project_#@storybook#addon-knobs#@storybook#components#recompose#fbjs" depends on it.
info Disk size without dependencies: "4.37MB"
info Disk size with unique dependencies: "4.37MB"
info Disk size with transitive dependencies: "4.37MB"
info Number of shared dependencies: 0
=> Found "babel-runtime#[email protected]"
info This module exists because "_project_#@storybook#addon-knobs#@storybook#components#react-syntax-highlighter#babel-runtime" depends on it.
info Disk size without dependencies: "7.68MB"
info Disk size with unique dependencies: "7.68MB"
info Disk size with transitive dependencies: "7.68MB"
info Number of shared dependencies: 0

✅ L'ajout de core-js@^2.6.9 à devDependencies l'a résolu pour moi.

Assurez-vous de supprimer vos node_modules dans un premier temps.
rm -rf node_modules

J'ai ce problème après la mise à niveau vers v5.1.9 partir de v5.0.6 .

Même problème. Correction après la rétrogradation de v5.1.9 à v5.0.6

@JamyGolden & @Exomnius pourriez-vous s'il vous plaît partager plus sur votre configuration?

la sortie de yarn why core-js est utile, un repo de reproduction l'est encore plus.

@ndelangen Je suis passé à 5.1.9 sans problème maintenant, je suppose qu'une nouvelle dépendance de patch a été installée et a résolu le problème 🤷‍♀️

Edit, a dû rétrograder à nouveau, échouant aux tests CI. J'ai fait un yarn why core-js dessus:

$ yarn why core-js
yarn why v1.17.3
[1/4] 🤔  Why do we have the module "core-js"...?
[2/4] 🚚  Initialising dependency graph...
[3/4] 🔍  Finding dependency...
[4/4] 🚡  Calculating file sizes...
=> Found "[email protected]"
info Has been hoisted to "core-js"
info Reasons this module exists
   - Hoisted from "@storybook#react#core-js"
   - Hoisted from "@storybook#addon-actions#core-js"
   - Hoisted from "@storybook#addon-links#core-js"
   - Hoisted from "@storybook#addon-storyshots#core-js"
   - Hoisted from "@storybook#addon-actions#@storybook#components#core-js"
   - Hoisted from "@storybook#addon-actions#@storybook#api#core-js"
   - Hoisted from "@storybook#react#@storybook#core#core-js"
   - Hoisted from "@storybook#addon-links#@storybook#core-events#core-js"
   - Hoisted from "@storybook#addon-storyshots#@storybook#addons#core-js"
   - Hoisted from "@storybook#addon-actions#@storybook#theming#core-js"
   - Hoisted from "@storybook#react#@storybook#node-logger#core-js"
   - Hoisted from "@storybook#addon-links#@storybook#router#core-js"
   - Hoisted from "@storybook#addon-storyshots#@storybook#addons#@storybook#channels#core-js"
   - Hoisted from "@storybook#react#@storybook#core#@storybook#channel-postmessage#core-js"
   - Hoisted from "@storybook#react#@storybook#core#@storybook#client-api#core-js"
   - Hoisted from "@storybook#react#@storybook#core#@storybook#ui#core-js"
   - Hoisted from "@storybook#addon-actions#@storybook#theming#@storybook#client-logger#core-js"
   - Hoisted from "@storybook#react#@storybook#core#lazy-universal-dotenv#core-js"
   - Hoisted from "@storybook#addon-actions#@storybook#components#simplebar-react#simplebar#core-js"
info Disk size without dependencies: "6.69MB"
info Disk size with unique dependencies: "6.69MB"
info Disk size with transitive dependencies: "6.69MB"
info Number of shared dependencies: 0
=> Found "protractor-flake#[email protected]"
info This module exists because "protractor-flake" depends on it.
info Disk size without dependencies: "3.45MB"
info Disk size with unique dependencies: "3.45MB"
info Disk size with transitive dependencies: "3.45MB"
info Number of shared dependencies: 0
=> Found "core-js-compat#[email protected]"
info This module exists because "@babel#preset-env#core-js-compat" depends on it.
info Disk size without dependencies: "6.63MB"
info Disk size with unique dependencies: "6.63MB"
info Disk size with transitive dependencies: "6.63MB"
info Number of shared dependencies: 0
=> Found "babel-runtime#[email protected]"
info This module exists because "social-tags-webpack-plugin#babel-runtime" depends on it.
info Disk size without dependencies: "7.66MB"
info Disk size with unique dependencies: "7.66MB"
info Disk size with transitive dependencies: "7.66MB"
info Number of shared dependencies: 0
=> Found "node-plop#[email protected]"
info This module exists because "plop#node-plop" depends on it.
info Disk size without dependencies: "7.66MB"
info Disk size with unique dependencies: "7.66MB"
info Disk size with transitive dependencies: "7.66MB"
info Number of shared dependencies: 0
=> Found "babel-polyfill#[email protected]"
info This module exists because "flow-typed#babel-polyfill" depends on it.
info Disk size without dependencies: "7.66MB"
info Disk size with unique dependencies: "7.66MB"
info Disk size with transitive dependencies: "7.66MB"
info Number of shared dependencies: 0
=> Found "fbjs#[email protected]"
info This module exists because "@storybook#addon-actions#@storybook#components#recompose#fbjs" depends on it.
info Disk size without dependencies: "4.37MB"
info Disk size with unique dependencies: "4.37MB"
info Disk size with transitive dependencies: "4.37MB"
info Number of shared dependencies: 0
✨  Done in 1.94s.

Vous l'avez fait fonctionner localement, mais le CI avait toujours la même erreur?

@ndelangen ouais le CI et un autre développeur ont des problèmes (je mettrai à jour avec leur version de fil / nœud quand je l'aurai), mais tout va bien de mon côté (fil 1.15.2 , nœud 8.15.1 ), nous utilisons également un fichier de verrouillage. Ce qui précède était l'échec yarn why core-js et c'est le mien:

yarn why core-js
yarn why v1.15.2
warning ../package.json: No license field
[1/4] 🤔  Why do we have the module "core-js"...?
[2/4] 🚚  Initialising dependency graph...
[3/4] 🔍  Finding dependency...
[4/4] 🚡  Calculating file sizes...
=> Found "[email protected]"
info Has been hoisted to "core-js"
info Reasons this module exists
   - Hoisted from "@storybook#react#core-js"
   - Hoisted from "@storybook#addon-actions#core-js"
   - Hoisted from "@storybook#addon-links#core-js"
   - Hoisted from "@storybook#addon-storyshots#core-js"
   - Hoisted from "@storybook#addon-actions#@storybook#components#core-js"
   - Hoisted from "@storybook#addon-actions#@storybook#api#core-js"
   - Hoisted from "@storybook#react#@storybook#core#core-js"
   - Hoisted from "@storybook#addon-links#@storybook#core-events#core-js"
   - Hoisted from "@storybook#addon-storyshots#@storybook#addons#core-js"
   - Hoisted from "@storybook#addon-actions#@storybook#theming#core-js"
   - Hoisted from "@storybook#react#@storybook#node-logger#core-js"
   - Hoisted from "@storybook#addon-links#@storybook#router#core-js"
   - Hoisted from "@storybook#addon-storyshots#@storybook#addons#@storybook#channels#core-js"
   - Hoisted from "@storybook#react#@storybook#core#@storybook#channel-postmessage#core-js"
   - Hoisted from "@storybook#react#@storybook#core#@storybook#client-api#core-js"
   - Hoisted from "@storybook#react#@storybook#core#@storybook#ui#core-js"
   - Hoisted from "@storybook#addon-actions#@storybook#theming#@storybook#client-logger#core-js"
   - Hoisted from "@storybook#react#@storybook#core#lazy-universal-dotenv#core-js"
   - Hoisted from "@storybook#addon-actions#@storybook#components#simplebar-react#simplebar#core-js"
info Disk size without dependencies: "6.69MB"
info Disk size with unique dependencies: "6.69MB"
info Disk size with transitive dependencies: "6.69MB"
info Number of shared dependencies: 0
=> Found "protractor-flake#[email protected]"
info This module exists because "protractor-flake" depends on it.
info Disk size without dependencies: "3.45MB"
info Disk size with unique dependencies: "3.45MB"
info Disk size with transitive dependencies: "3.45MB"
info Number of shared dependencies: 0
=> Found "core-js-compat#[email protected]"
info This module exists because "@babel#preset-env#core-js-compat" depends on it.
info Disk size without dependencies: "6.63MB"
info Disk size with unique dependencies: "6.63MB"
info Disk size with transitive dependencies: "6.63MB"
info Number of shared dependencies: 0
=> Found "babel-runtime#[email protected]"
info This module exists because "social-tags-webpack-plugin#babel-runtime" depends on it.
info Disk size without dependencies: "7.66MB"
info Disk size with unique dependencies: "7.66MB"
info Disk size with transitive dependencies: "7.66MB"
info Number of shared dependencies: 0
=> Found "node-plop#[email protected]"
info This module exists because "plop#node-plop" depends on it.
info Disk size without dependencies: "7.66MB"
info Disk size with unique dependencies: "7.66MB"
info Disk size with transitive dependencies: "7.66MB"
info Number of shared dependencies: 0
=> Found "babel-polyfill#[email protected]"
info This module exists because "flow-typed#babel-polyfill" depends on it.
info Disk size without dependencies: "7.66MB"
info Disk size with unique dependencies: "7.66MB"
info Disk size with transitive dependencies: "7.66MB"
info Number of shared dependencies: 0
=> Found "fbjs#[email protected]"
info This module exists because "@storybook#addon-actions#@storybook#components#recompose#fbjs" depends on it.
info Disk size without dependencies: "4.37MB"
info Disk size with unique dependencies: "4.37MB"
info Disk size with transitive dependencies: "4.37MB"
info Number of shared dependencies: 0
✨  Done in 2.85s.

Un exemple de la même erreur qui existe sur chaque assertion:

FAIL path/to/test/index.spec.js
  ● Test suite failed to run

    Cannot find module 'core-js/modules/es6.symbol' from 'localMocksFile.js'

aha, donc le livre de contes fonctionne bien, mais un test utilise toujours une ancienne version core-js!

Qu'y a-t-il à l'intérieur de localMocksFile.js ? Il vous suffit probablement de mettre à jour ce fichier.

@ndelangen l'erreur que j'ai précédemment collée était liée aux storyshots en cours d'exécution (ce qui ne se produit qu'après la mise à jour de la version du livre de contes). Les erreurs que l'autre dev obtient lors de l'exécution de yarn storybook contiennent de nombreuses erreurs similaires, apparemment une erreur sur chaque fichier:

Entrypoint main [big] = runtime~main.78e9af38499895fecc3d.bundle.js runtime~main.78e9af38499895fecc3d.bundle.js.map vendors~main.78e9af38499895fecc3d.bundle.js vendors~main.78e9af38499895fecc3d.bundle.js.map main.78e9af38499895fecc3d.bundle.js main.78e9af38499895fecc3d.bundle.js.map
[0] multi ./node_modules/@storybook/core/dist/server/common/polyfills.js ./node_modules/@storybook/core/dist/server/preview/globals.js ./.storybook/config.js ./node_modules/webpack-hot-middleware/client.js?reload=true 64 bytes {main} [built]
[./.storybook/config.js] 368 bytes {main} [built]
[./app sync recursive \.stories\.(js|jsx)$] ./app sync \.stories\.(js|jsx)$ 5.07 KiB {main} [built]
[./node_modules/@storybook/core/dist/server/common/polyfills.js] 120 bytes {vendors~main} [built]
[./node_modules/@storybook/core/dist/server/preview/globals.js] 93 bytes {vendors~main} [built]
[./node_modules/@storybook/core/node_modules/webpack/buildin/harmony-module.js] (webpack)/buildin/harmony-module.js 573 bytes {vendors~main} [built]
[./node_modules/@storybook/core/node_modules/webpack/buildin/module.js] (webpack)/buildin/module.js 497 bytes {vendors~main} [built]
[./node_modules/@storybook/react/dist/client/index.js] 1.26 KiB {vendors~main} [built]
[./node_modules/airbnb-js-shims/index.js] 40 bytes {vendors~main} [built]
[./node_modules/core-js/features/symbol/index.js] 251 bytes {vendors~main} [built]
[./node_modules/global/window.js] 232 bytes {vendors~main} [built]
[./node_modules/mockdate/src/mockdate.js] 1.78 KiB {vendors~main} [built]
[./node_modules/querystring-es3/index.js] 127 bytes {vendors~main} [built]
[./node_modules/regenerator-runtime/runtime.js] 23 KiB {vendors~main} [built]
[./node_modules/webpack-hot-middleware/client.js?reload=true] 7.68 KiB {vendors~main} [built]
    + 1352 hidden modules

ERROR in ./app/helpers/device.js
Module not found: Error: Cannot find module 'core-js/modules/es6.regexp.match'
 @ ./app/helpers/device.js 1:0-42 1:42-84
 @ ./app/helpers/index.js
 @ ./app/components/Button/index.js
 @ ./app/components/Button/__tests__/index.stories.js
 @ ./app sync \.stories\.(js|jsx)$
 @ ./.storybook/config.js
 @ multi ./node_modules/@storybook/core/dist/server/common/polyfills.js ./node_modules/@storybook/core/dist/server/preview/globals.js ./.storybook/config.js ./node_modules/webpack-hot-middleware/client.js?reload=true
...

Je ne sais pas si ces informations sont utiles, mais @babel/polyfill n'est pas inclus dans le package.json principal du projet.

J'ai l'erreur suivante:

ERREUR dans ./.storybook/config.js
Module non trouvé: Erreur: Impossible de trouver le module 'core-js / modules / web.dom.iterable'

J'utilise storybook / vue 5.1.9.

Résolu en installant https://www.npmjs.com/package/babel-loader

package.json

  "dependencies": {
    "babel-loader": "^8.0.6"
  },
  "devDependencies": {
    "@storybook/addon-actions": "^5.1.11",
    "@storybook/addon-links": "^5.1.11",
    "@storybook/addons": "^5.1.11",
    "@storybook/react": "^5.1.11"
  }

C'est une solution de contournement plutôt qu'un correctif, mais la restauration de TOUS mes packages de Storybook (y compris les addons) vers la version 5.0.6 a résolu ce problème. Rien d'autre dans ce fil n'a aidé.

(Commandes pour React + Yarn ci-dessous, mais facilement traduisibles en NPM / Vue):

Le premier debout:

yarn remove @storybook/react @storybook/addon-actions @storybook/addon-knobs @storybook/addon-links @storybook/addon-notes @storybook/addons @storybook/addon-storyshots 

Suivi par:

yarn add @storybook/[email protected] @storybook/[email protected] @storybook/[email protected] @storybook/[email protected] @storybook/[email protected] @storybook/[email protected] @storybook/[email protected]

Je vois le même problème lorsque j'essaye d'exécuter un livre d'histoires:
ERROR in ./src/lib/helpers.js Module not found: Error: Cannot find module 'core-js/modules/web.dom.iterable' @ ./src/lib/helpers.js 16:0-43 @ ./src/components/Person.js @ ./src/components/Person.stories.js @ ./src sync \.stories\.js$ @ ./.storybook/config.js @ multi ./node_modules/@storybook/core/dist/server/common/polyfills.js ./node_modules/@storybook/core/dist/server/preview/globals.js ./.storybook/config.js (webpack)-hot-middleware/client.js?reload=true&quiet=true

Cela s'est produit après la mise à jour vers le nœud v12 à l'aide de nvm.

Nous avons dû faire cela pour résoudre un problème de polyfill afin que je ne puisse pas rétrograder le nœud. Avant cela, tout fonctionnait. Malheureusement, je ne sais pas sur quelle version de nœud j'étais avant cela. J'ai tout essayé sur ce fil, mais je ne veux pas revenir à la version 5.0.6., Car une des principales raisons de la configuration du livre d'histoires pour ce projet est d'utiliser les nouveaux documents. J'ai tout poussé ici: https://github.com/netliferesearch/netlife2019/tree/storybook_setup_stories

Edit: J'ai rétrogradé le nœud et cela ne fonctionne toujours pas, j'aurais dû essayer cela avant de poster. Je suis un peu perdu de ce qui se passe, je vais continuer à chercher.

Utiliser @storybook/vue 5.2.5 en plus de Nuxt.js v2.10.1 et a eu le même problème: yarn storybook fonctionne, mais yarn build ou toute autre tâche liée à nuxt a échoué. yarn why core-js fournit la sortie suivante:

$ yarn why core-js
yarn why v1.17.3
[1/4] 🤔  Why do we have the module "core-js"...?
[2/4] 🚚  Initialising dependency graph...
[3/4] 🔍  Finding dependency...
[4/4] 🚡  Calculating file sizes...
=> Found "[email protected]"
info Has been hoisted to "core-js"
info Reasons this module exists
   - Hoisted from "@storybook#addon-actions#core-js"
   - Hoisted from "@storybook#addon-knobs#core-js"
   - Hoisted from "@storybook#addon-links#core-js"
   - Hoisted from "@storybook#addon-viewport#core-js"
   - Hoisted from "@storybook#addons#core-js"
   - Hoisted from "@storybook#vue#core-js"
   - Hoisted from "@storybook#addon-actions#@storybook#api#core-js"
   - Hoisted from "@storybook#addons#@storybook#channels#core-js"
   - Hoisted from "@storybook#addon-actions#@storybook#client-api#core-js"
   - Hoisted from "@storybook#addon-viewport#@storybook#client-logger#core-js"
   - Hoisted from "@storybook#addon-actions#@storybook#components#core-js"
   - Hoisted from "@storybook#addon-actions#@storybook#core-events#core-js"
   - Hoisted from "@storybook#vue#@storybook#core#core-js"
   - Hoisted from "@storybook#addon-links#@storybook#router#core-js"
   - Hoisted from "@storybook#addon-actions#@storybook#theming#core-js"
   - Hoisted from "@storybook#addon-actions#@storybook#client-api#@storybook#channel-postmessage#core-js"
   - Hoisted from "@storybook#vue#@storybook#core#@storybook#node-logger#core-js"
   - Hoisted from "@storybook#vue#@storybook#core#@storybook#ui#core-js"
   - Hoisted from "@storybook#vue#@storybook#core#lazy-universal-dotenv#core-js"
   - Hoisted from "@storybook#addon-actions#@storybook#components#simplebar-react#simplebar#core-js"
info Disk size without dependencies: "7.02MB"
info Disk size with unique dependencies: "7.02MB"
info Disk size with transitive dependencies: "7.02MB"
info Number of shared dependencies: 0
=> Found "babel-runtime#[email protected]"
info This module exists because "@storybook#addon-actions#react-inspector#babel-runtime" depends on it.
info Disk size without dependencies: "7.68MB"
info Disk size with unique dependencies: "7.68MB"
info Disk size with transitive dependencies: "7.68MB"
info Number of shared dependencies: 0
=> Found "@nuxt/babel-preset-app#[email protected]"
info This module exists because "nuxt#@nuxt#webpack#@nuxt#babel-preset-app" depends on it.
info Disk size without dependencies: "7.68MB"
info Disk size with unique dependencies: "7.68MB"
info Disk size with transitive dependencies: "7.68MB"
info Number of shared dependencies: 0
=> Found "@vue/babel-preset-app#[email protected]"
info This module exists because "vuepress#@vuepress#core#@vue#babel-preset-app" depends on it.
info Disk size without dependencies: "7.68MB"
info Disk size with unique dependencies: "7.68MB"
info Disk size with transitive dependencies: "7.68MB"
info Number of shared dependencies: 0
=> Found "@babel/runtime-corejs2#[email protected]"
info This module exists because "vuepress#@vuepress#core#@vue#babel-preset-app#@babel#runtime-corejs2" depends on it.
info Disk size without dependencies: "7.68MB"
info Disk size with unique dependencies: "7.68MB"
info Disk size with transitive dependencies: "7.68MB"
info Number of shared dependencies: 0
=> Found "fbjs#[email protected]"
info This module exists because "@storybook#addon-links#@storybook#router#@reach#router#create-react-context#fbjs" depends on it.
info Disk size without dependencies: "4.37MB"
info Disk size with unique dependencies: "4.37MB"
info Disk size with transitive dependencies: "4.37MB"
info Number of shared dependencies: 0
✨  Done in 1.25s.

J'utilise donc la même approche fournie par @frebro , essayez

$ yarn add -D [email protected]

et 🎉: j'obtiens un environnement de travail: yarn storybook , yarn build et toutes les autres tâches fonctionnent à nouveau.

@rwam yarn add -D [email protected] fonctionne pour moi dans mon livre d'histoires 5.2.5 projet HTML thx mec :)

Vue avec @ vue / cli migrant

à propos de l'erreur:

si 'core-js': '^3.*.*':

ERROR in ./.storybook/config.js
Module not found: Error: Cannot find module 'core-js/modules/web.dom.iterable'

si 'core-js': '^2.*.*':

// many errors from storybook and addons
Cannot find module 'core-js/modules/***'

à propos de deps:

"@vue/cli*": "^4.0.5", depends on 'core-js': '^3.*.*'
"@vue/cli*": "^3.*.*", depends on 'core-js': '^2.*.*'
"@storybook/vue": "^5.1.0", depends on 'core-js': '^3.*.*' with d.ts
"@storybook/vue": "^5.0.6", depends on 'core-js': '^2.*.*' but without d.ts

mes deps de travail:

"@vue/cli*": "^4.0.5", depends on 'core-js': '^3.*.*'
"@storybook/vue": "^5.1.0", depends on 'core-js': '^3.*.*' with d.ts

https://cli.vuejs.org/migrating-from-v3/#migrating -from-v3
si Invalid Option: corejs is not a valid top-level option : -rm -rf node_modules .

Santé pour vous et vos proches;)

J'ai trouvé une solution plus robuste pour faire fonctionner Storybook dans un projet Nuxt. La solution dépend d'une incompatibilité de version de core-js. Nuxt utilise par défaut la version 2 et la version 3. de Storybook. Donc, pour résoudre le problème, je dois suivre cette note de @ nuxt / babel-preset-app :

Remarque: étant donné que core-js @ 2 et core-js @ 3 sont tous deux pris en charge depuis Babel 7.4.0, nous vous recommandons d'ajouter directement core-js et de définir la version via l'option corejs.

Je reçois à nouveau un environnement de travail avec Nuxt 2.11.0 en utilisant cette mise à nuxt.config.js :

yarn add --dev core-js<strong i="15">@3</strong> @babel/runtime-corejs3

export default {
  …
  build: {
    babel: {
      presets() {
        return [
          [
            '@nuxt/babel-preset-app',
            {
              corejs: { version: 3 }
            }
          ]
        ]
      }
    }
  }
}

Je suis tombé sur cette solution car je ne pouvais pas mettre à

J'ai rencontré le même problème en essayant d'ajouter un livre d'histoires (5.3.18) à gatsby v2 alors qu'au bail un composant utilisait des requêtes statiques. Le déplacement de .babelrc vers .storybook a fonctionné comme suggéré par @brycehill .

J'ai trouvé une solution plus robuste pour faire fonctionner Storybook dans un projet Nuxt. La solution dépend d'une incompatibilité de version de core-js. Nuxt utilise par défaut la version 2 et la version 3. de Storybook. Donc, pour résoudre le problème, je dois suivre cette note de @ nuxt / babel-preset-app :

Remarque: étant donné que core-js @ 2 et core-js @ 3 sont tous deux pris en charge depuis Babel 7.4.0, nous vous recommandons d'ajouter directement core-js et de définir la version via l'option corejs.

Je reçois à nouveau un environnement de travail avec Nuxt 2.11.0 en utilisant cette mise à nuxt.config.js :

yarn add --dev core-js<strong i="16">@3</strong> @babel/runtime-corejs3

export default {
  …
  build: {
    babel: {
      presets() {
        return [
          [
            '@nuxt/babel-preset-app',
            {
              corejs: { version: 3 }
            }
          ]
        ]
      }
    }
  }
}

Je suis tombé sur cette solution car je ne pouvais pas mettre à

Génial, a fonctionné pour moi!

@masives Rencontre le même problème avec gatsby. Pourriez-vous publier un lien vers le commentaire / .babelrc car je n'arrive pas à les trouver dans ce numéro.

Nvm. Les problèmes étaient causés par des histoires dans le répertoire des pages. Résolution du problème en déplaçant les pages d'histoires vers __stories__

Next.js 9.1.1 -> Next.js 9.4.4 m'a fait trébucher.

La comparaison des résultats de npm list core-js révélé qu'un runtime babel de core js manquait après la mise à jour de Next. J'ai réinstallé ce paquet manquant dans les dépendances de développement et LO et voilà que cela a fonctionné

cc @ndelangen

Même problème avec la version 5.3.19 lors de la migration de core-js v2 vers v3

Même problème pour moi. Comme @denimamab, j'utilise la version 5.3.19

Corrigé localement avec:
rm ./package-lock.json
rm -rf ./node_modules
npm installer

Maintenant, le livre de contes npm run fonctionne

Je voulais juste partager mon expérience avec ce bug après avoir passé une journée dessus ...

J'ai lu de nombreux threads sur les problèmes GH, y compris celui-ci, lors du dépannage du problème. J'ai essayé quelques-uns des correctifs suggérés, un seul aboutissant à un succès "acceptable".

Référence

Mettre tout cela en un seul endroit depuis, cuz. 😅

{
  "presets": [
    "@babel/preset-env",
    "@babel/preset-react"
  ],
  "plugins": [
    "@babel/plugin-transform-modules-commonjs",
    "@babel/plugin-transform-object-assign",
    "@babel/plugin-proposal-class-properties",
    "@babel/plugin-proposal-optional-chaining",
    "@babel/plugin-transform-runtime"
  ],
  "sourceRoot": "./"
}

last 2 versions
> 1%
IE >= 11

"scripts": {
  "build:storybook": "build-storybook --quiet -o ./dist/storybook",
  "storybook": "start-storybook -p 6006"
},
"dependencies": {
  "@babel/core": "7.3.4",
  "@babel/plugin-proposal-class-properties": "7.3.4",
  "@babel/plugin-proposal-optional-chaining": "7.7.5",
  "@babel/plugin-transform-modules-commonjs": "7.2.0",
  "@babel/plugin-transform-object-assign": "7.2.0",
  "@babel/plugin-transform-runtime": "7.6.2",
  "@babel/polyfill": "7.2.5",
  "@babel/preset-env": "7.3.4",
  "@babel/preset-react": "7.0.0",
  "babel-loader": "8.0.6",
  "react": "16.10.2",
  "react-dom": "16.10.2",
  "webpack": "4.43.0",
  "webpack-cli": "3.3.11"
},
"devDependencies": {
  "@storybook/addon-a11y": "5.3.19",
  "@storybook/addon-actions": "5.3.19",
  "@storybook/addon-docs": "5.3.19",
  "@storybook/addon-knobs": "5.3.19",
  "@storybook/addon-links": "5.3.19",
  "@storybook/addons": "5.3.19",
  "@storybook/react": "5.3.19",
  "@storybook/source-loader": "5.3.19",
  "acorn": "7.2.0",
  "storybook-design-token": "0.7.3",
  "webpack-dev-server": "3.10.3"
}

  System:
    OS: macOS 10.15.7
    CPU: (12) x64 Intel(R) Core(TM) i7-8750H CPU @ 2.20GHz
    Shell: 5.0.2 - /usr/local/bin/bash (via homebrew)
  Binaries:
    Node: 10.18.0
    npm: 6.13.4
  Browsers:
    Chrome: 86.0.4240.193
    Firefox: 80.0.1
    Safari: 14.0

Statut du projet et conditions préalables

• J'ai un changement exceptionnel et séparé pour mettre à jour tous les paquets webpack / babel [de mon équipe] (babel est v7.xx dans mon changement et dans le changement séparé), mais il n'a pas encore été mis hors test en raison de notre test ie11 Infrastructure. le changement introduit corejs version 3 comme dépendance et useBuiltIns: 'usage' , où auparavant nous utilisions une importation manuelle de @babel/polyfill et la valeur par défaut pour useBuiltIns . je prévois que ce changement sera bientôt fusionné. c'est la principale raison pour laquelle je ne peux / ne vais pas inclure corejs en tant que dépendance dans mon changement actuel, comme beaucoup d'autres l'ont suggéré (et vérifié) comme correctif.
• J'ai _un autre_ changement exceptionnel, basé sur la branche qui met à jour les packages webpack / babel, qui met à niveau notre version de livre de contes de la v5.3.19 à la dernière version v6.xx je n'ai pas essayé de reproduire ce bogue dans cette branche car je suppose que tout ira bien ) ma raison pour laquelle est décrite ci-dessous.
• Le projet actuel a une racine .babelrc (vue ci-dessus) pour l'application principale. cette configuration utilise @babel/preset-env et utilise une racine .browserslistrc (vue ci-dessus) pour déterminer l'utilisation de polyfill. no .storybook/.babelrc est présent dans la branche principale de notre application.
• nous utilisons le livre d'histoires uniquement pour la documentation interne des développeurs. puisque l'organisation utilise principalement chrome comme navigateur par défaut, les polyfills sont inutiles. cette révélation a en fait contribué à la solution finale.
• Je _am_ en utilisant une configuration webpack de livre de contes personnalisé, mais uniquement pour ajouter des règles supplémentaires autour des polices / images. J'ai abandonné la tentative de modifier les règles de base autour du traitement de .js pour les raisons exposées dans ce numéro de livre de contes .
• JE FAIS L'EXPÉRIENCE DE CE PROBLÈME LORS DE LA GÉNÉRATION DU SITE STATIC STORYBOOK l'exécution via le serveur de développement inclus pour le développement local ne rencontre aucun problème.

Tentatives de correction précoce

La plupart de mes premières tentatives pour résoudre le problème tournaient autour d'essayer de définir des options dans la racine .babelrc (voir ci-dessus) pour essayer de communiquer à babel (tel que exécuté par l'outil build-storybook ) comment je veux la transpilation à se produire. Aucune configuration de useBuiltIns , sourceType , etc. comme suggéré par d'autres n'a réussi. De plus, j'ai essayé toute la route clean-npm-cache-remove-node-modules-and-package-lock-then-npm-install, en vain (même si cela _did_ a fait changer un peu de profondeur).

Solution finale

Tout en hésitant au départ à essayer d'utiliser un .storybook/.babelrc , je manquais d'options. J'avais déjà essayé de créer ce fichier et de le faire fonctionner harmonieusement avec la racine .babelrc via la propriété extends et de frapper un mur, mais j'ai décidé de faire un autre essai.

Un simple déplacement de la configuration racine de babel vers la configuration spécifique au livre d'histoires a permis à la construction du site statique de se terminer avec succès, mais il y avait encore des erreurs d'exécution indiquant une transpilation défectueuse (la réexportation de certaines importations avait pour résultat que ces valeurs étaient undefined dans le fichier dans lequel les importations finales vivent). C'est à peu près à cette époque que j'ai réalisé que je n'avais pas besoin de polyfills pour un livre d'histoires, j'ai donc supprimé le préréglage @babel/preset-env dans le nouveau .storybook/.babelrc . HUZZAH, problème résolu! La configuration d'origine devait cependant persister pour l'application, j'ai donc renommé .storybook/.babelrc-ci et restauré la configuration racine d'origine. Ensuite, j'ai dû mettre à jour notre pipeline CI pour vérifier la configuration ci et renommer pour couper le suffixe -ci avant la construction du site statique, mais c'était trivial.

Deviner le (s) problème (s)

Ce processus m'a fait inspecter fréquemment mes paquets et le fichier de verrouillage, et j'ai découvert que, bien que le livre de contes v5.3.19 et tous ses addons aient une dépendance sur corejs v3.xx, le @babel/polyfill existant et une poignée d'autres babel deps s'est appuyé sur corejs v2.xx! Je suppose qu'au moins un problème est la résolution dans l'application d'utiliser le plus petit dénominateur commun de la v2. Cela avait du sens puisque les erreurs que je rencontrais faisaient référence à des modules comme es.array.iterator tandis que la v2 fournit des modules comme es6.array.iterator . Je ne suis pas sûr de savoir en quoi le dep de livre d'histoires est en conflit s'il vise à prendre en charge les anciennes configurations babel / corejs, mais cela semble être le cas. De plus, il doit y avoir quelque chose sur la façon dont / all storybook-babel / installed babel / storybook-corejs / installed-corejs trouve et applique un .babelrc existant. Je ne sais pas pourquoi déplacer la configuration racine dans une configuration spécifique au livre d'histoire résout comme par magie le problème. Chemin peut-être? 🤷‍♂️

Conclusion

Si vous êtes resté dans les parages après tout ce bavardage, félicitations! 😂

Dans l'ensemble, je ne suis pas ravi des obstacles que j'ai dû franchir pour contourner ce problème, mais ma situation est peut-être un peu unique. De plus, je serai capable de tout déchirer après la fusion de mes mises à jour babel / webpack / storybook susmentionnées.

Quoi qu'il en soit, j'espère que cela a été intéressant pour au moins une personne souffrant du même problème. Et je vais aller de l'avant et taguer @shilman et @ndelangen car ils semblent investis dans la résolution de ce problème. 👋