<p>storybook @ 6 выдает ошибку core-js</p>

cc @ndelangen

У меня та же проблема.
Я установил точку останова для метода webpackFinal, но он не сработал.
Я подозреваю, что изменение здесь вызвало эту проблему, которая была хороша до 6.0.0 beta14.

Я столкнулся с этой же проблемой при попытке перейти с v5.3 на v6.0.0-beta38 (хотя и получаю те же / похожие проблемы с более низкими бета-версиями).

Мой webpack.config.js:

const path = require('path');

module.exports = ({ config }) => {
    config.module.rules.push({
        test: /\.stories\.js?$/,
        loaders: [require.resolve('@storybook/source-loader')],
        enforce: 'pre',
    });

    config.module.rules = config.module.rules.map(rule => {
        if (
            String(rule.test) ===
            String(
                /\.(svg|ico|jpg|jpeg|png|gif|eot|otf|webp|ttf|woff|woff2|cur|ani|pdf)(\?.*)?$/
            )
        ) {
            return {
                ...rule,
                test: /\.(ico|jpg|jpeg|png|gif|eot|otf|webp|ttf|woff|woff2|cur|ani)(\?.*)?$/,
            };
        }

        return rule;
    });

    config.module.rules.push({
        test: /\.svg$/,
        use: [
            {
                loader: '@svgr/webpack',
                options: {
                    svgo: false,
                },
            },
        ],
    });

    return config;
};

При попытке запустить build-storybook -s public -o ./docs в выводе появляется следующая ошибка:

info => Compiling preview..
70% building 225/248 modules 23 active <LOCAL_PROJECT_PATH>/node_modules/@storybook/components/dist/Button/Button.jsERR! => Failed to build the preview
ERR! Module not found: Error: Can't resolve 'chromatic/isChromatic' in '<LOCAL_PROJECT_PATH>/node_modules/@storybook/ui/dist/components/layout'
(node:11596) UnhandledPromiseRejectionWarning: ModuleNotFoundError: Module not found: Error: Can't resolve 'chromatic/isChromatic' in '<LOCAL_PROJECT_PATH>/node_modules/@storybook/ui/dist/components/layout'
    at <LOCAL_PROJECT_PATH>/node_modules/webpack/lib/Compilation.js:925:10
    at <LOCAL_PROJECT_PATH>/node_modules/webpack/lib/NormalModuleFactory.js:401:22
    at <LOCAL_PROJECT_PATH>/node_modules/webpack/lib/NormalModuleFactory.js:130:21
    at <LOCAL_PROJECT_PATH>/node_modules/webpack/lib/NormalModuleFactory.js:224:22
    at <LOCAL_PROJECT_PATH>/node_modules/neo-async/async.js:2830:7
    at <LOCAL_PROJECT_PATH>/node_modules/neo-async/async.js:6877:13
    at <LOCAL_PROJECT_PATH>/node_modules/webpack/lib/NormalModuleFactory.js:214:25
    at <LOCAL_PROJECT_PATH>/node_modules/enhanced-resolve/lib/Resolver.js:213:14
    at <LOCAL_PROJECT_PATH>/node_modules/enhanced-resolve/lib/Resolver.js:285:5
    at eval (eval at create (<LOCAL_PROJECT_PATH>/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:13:1)
    at <LOCAL_PROJECT_PATH>/node_modules/enhanced-resolve/lib/UnsafeCachePlugin.js:44:7
    at <LOCAL_PROJECT_PATH>/node_modules/enhanced-resolve/lib/Resolver.js:285:5
    at eval (eval at create (<LOCAL_PROJECT_PATH>/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:13:1)
    at <LOCAL_PROJECT_PATH>/node_modules/enhanced-resolve/lib/Resolver.js:285:5
    at eval (eval at create (<LOCAL_PROJECT_PATH>/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:25:1)
    at <LOCAL_PROJECT_PATH>/node_modules/enhanced-resolve/lib/DescriptionFilePlugin.js:67:43
(node:11596) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
(node:11596) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
70% building 932/932 modules 0 activenpm ERR! code ELIFECYCLE

* (фактический путь к проекту был заменен мной на <LOCAL_PROJECT_PATH> )

ERR! Модуль не найден: ошибка: не удается разрешить 'chromatic / isChromatic' в '/ node_modules / @ storybook / ui / dist / components / layout '
(узел: 11596) UnhandledPromiseRejectionWarning: ModuleNotFoundError: модуль не найден: ошибка: не удается разрешить 'chromatic / isChromatic' в '/ node_modules / @ storybook / ui / dist / components / layout '

а? Я действительно сбит с толку .. предварительный просмотр объединяет код для менеджера .. и в нем отсутствует devDependency .. Это имеет очень мало смысла ..

@ndelangen Извините, пожалуйста, не обращайте внимания на последнюю ошибку - похоже, она была похожа на эту: # 11356. Моя конфигурация main.js установлена ​​на

module.exports = {
    stories: ['../**/*.stories.@(js)'],
    addons: [
        '@storybook/addon-a11y',
        '@storybook/addon-docs',
        '@storybook/addon-links',
        '@storybook/addon-storysource',
        '@storybook/addon-toolbars',
        '@storybook/addon-viewport',
    ],
};

так что глобус означал, что он мог загружать истории из моего node_modules . 🤦

Я обновил глобус, чтобы смотреть исключительно на мою папку src и теперь я получаю проблему core-js упомянутую OP ...

info => Compiling preview..
70% building 26/29 modules 3 active <LOCAL_PROJECT_PATH>/node_modules/global/window.jsERR! => Failed to build the preview
ERR! Module not found: Error: Can't resolve 'core-js/modules/es.symbol' in '<LOCAL_PROJECT_PATH>/.storybook'
(node:3625) UnhandledPromiseRejectionWarning: ModuleNotFoundError: Module not found: Error: Can't resolve 'core-js/modules/es.symbol' in '<LOCAL_PROJECT_PATH>/.storybook'
    at <LOCAL_PROJECT_PATH>/node_modules/webpack/lib/Compilation.js:925:10
    at <LOCAL_PROJECT_PATH>/node_modules/webpack/lib/NormalModuleFactory.js:401:22
    at <LOCAL_PROJECT_PATH>/node_modules/webpack/lib/NormalModuleFactory.js:130:21
    at <LOCAL_PROJECT_PATH>/node_modules/webpack/lib/NormalModuleFactory.js:224:22
    at <LOCAL_PROJECT_PATH>/node_modules/neo-async/async.js:2830:7
    at <LOCAL_PROJECT_PATH>/node_modules/neo-async/async.js:6877:13
    at <LOCAL_PROJECT_PATH>/node_modules/webpack/lib/NormalModuleFactory.js:214:25
    at <LOCAL_PROJECT_PATH>/node_modules/enhanced-resolve/lib/Resolver.js:213:14
    at <LOCAL_PROJECT_PATH>/node_modules/enhanced-resolve/lib/Resolver.js:285:5
    at eval (eval at create (<LOCAL_PROJECT_PATH>/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:13:1)
    at <LOCAL_PROJECT_PATH>/node_modules/enhanced-resolve/lib/UnsafeCachePlugin.js:44:7
    at <LOCAL_PROJECT_PATH>/node_modules/enhanced-resolve/lib/Resolver.js:285:5
    at eval (eval at create (<LOCAL_PROJECT_PATH>/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:13:1)
    at <LOCAL_PROJECT_PATH>/node_modules/enhanced-resolve/lib/Resolver.js:285:5
    at eval (eval at create (<LOCAL_PROJECT_PATH>/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:25:1)
    at <LOCAL_PROJECT_PATH>/node_modules/enhanced-resolve/lib/DescriptionFilePlugin.js:67:43
(node:3625) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
(node:3625) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
70% building 1953/1953 modules 0 activenpm ERR! code ELIFECYCLE

И, как предлагает @ 43081j , добавление core-js v3 в качестве зависимости разработчика исправляет это, но это не похоже на отличное решение ...

Я столкнулся с той же проблемой, пытаясь обновить свой сборник рассказов с 5.2.5 до 6.0.0-rc.9. Как и @BWrites, я добавил последнюю core-js в качестве зависимости разработчика и исправил ее, но я согласен, что это не лучшее решение.

Всем привет! Похоже, что в последнее время в этом вопросе особо ничего не происходит. Если все еще есть вопросы, комментарии или ошибки, пожалуйста, продолжайте обсуждение. К сожалению, у нас нет времени разбираться в каждой проблеме. Мы всегда открыты для предложений, поэтому, если вы хотите помочь, отправьте нам запрос на включение. Неактивные вопросы будут закрыты через 30 дней. Благодаря!

Напоминаю, что теперь, когда вы официально опубликовали 6.0, это все еще проблема.

Очень неудобно устанавливать core-js непосредственно в каждое репо, для которого мы используем сборник рассказов. есть ли у вас какое-нибудь решение для этого? чем мы можем помочь?

@ 43081j Я не думаю, что мы понимаем проблему. Возможно, @ndelangen поделится здесь своей мудростью.

по сути, сгенерированный вывод сборника рассказов пытается требовать core-js для различных полифиллов.

Я предполагаю, потому что это сгенерированный вывод и не "живет" в каталоге сборника рассказов ( node_modules/@storybook ), он разрешит первые доступные core-js с верхнего уровня, а не разрешит его относительно каталога сборника рассказов.

поэтому, если у вас есть сборник рассказов в проекте, в котором уже есть другая версия core-js (не обязательно как прямая зависимость, все виды других проектов также зависят от core-js), он может потребоваться случайно, а не тот сборник рассказов хочет.

это означает, что пути не могут разрешиться, если две версии core-js сильно отличаются.

обходной путь ( npm i -D core-js ) решает проблему, потому что тогда ваш core-js верхнего уровня будет той же версии, что и один сборник рассказов. затем старая версия будет перемещена глубже, чтобы жить рядом со всем, что в ней требовалось.

@ 43081j. Могли бы вы соединиться с @ndelangen ?

Также есть эта проблема.

Основываясь на https://github.com/storybookjs/storybook/issues/6204#issuecomment -478992364, я добавил это в свою конфигурацию, и теперь он правильно разрешается:

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

Обратите внимание, что это указывает на корневую папку node_modules/core-js в моем проекте, а не на ту, которая связана с чем-либо еще.

@shilman Посмотрим, получится ли у меня немного свободного времени на выходных, и попробую хотя бы немного его отладить. Я думаю, это будет связано с конфигурацией веб-пакета и где он разрешает модули из

я предполагаю, что мы эффективно запускаем webpack из каталога проекта. затем, когда мы генерируем нашу запись webpack, где-то в дереве мы должны потребовать core-js. но к этому моменту CWD webpack является директорией проекта, а не директорией сборника рассказов, поэтому он будет использовать все, что есть в корневой версии core-js, вместо того, что требуется сборнику рассказов.

мы могли бы сделать то же, что и в предыдущем комментарии, но явно использовать путь к core-js сборника рассказов. но это кажется настоящим позором и немного хакерским, поскольку именно эта проблема может возникнуть с любым количеством зависимостей в теории.

Тоже самое. Просто создайте чистый проект с помощью vue-cli, добавив сборник рассказов и сборник рассказов-документов. npm run storybook дает много Module not found: Error: Can't resolve 'core-js/modules/... .

тоже самое. Обновление сборника рассказов с версии 5.3. до 6.0.12 - приводит к кучу ошибок типа Can't resolve 'core-js/modules/web.dom-collections.iterator'

То же самое здесь, даже с обходным путем :(

у того же есть куча ошибок, например
Module not found: Error: Can't resolve 'core-js/modules/web.dom-collections.iterator'
Module not found: Error: Can't resolve 'core-js/modules/es.symbol.iterator'

Также есть эта проблема.

Основываясь на # 6204 (комментарий) , я добавил это в свою конфигурацию, и теперь он разрешается правильно:

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

Обратите внимание, что это указывает на корневую папку node_modules/core-js в моем проекте, а не на ту, которая связана с чем-либо еще.

@MattFisher, какой файл конфигурации?

@awkale main.js :)

Я думаю, что окончательное решение состоит в том, что мы настраиваем конфигурацию webpack для сопоставления с правильными core-js при создании сборки. но я не совсем уверен, где это сейчас происходит, потому что происходит много динамической магии, генерация пакетов и т. д.

Если кто-то может указать мне в правильном направлении, я буду рад понять это и продвигать.

@ndelangen, пожалуйста, поработайте с @ 43081j над этим 🙏

Первоначально я написал https://github.com/ndelangen/corejs-upgrade-webpack-plugin, чтобы «решить» эту проблему.

Но я отказался от него, потому что он просто добавляет другие проблемы, см.
https://github.com/storybookjs/storybook/issues/7445 и https://github.com/ndelangen/corejs-upgrade-webpack-plugin/issues/7

конфликтующие версии corejs - это проклятие моего существования.

@ 43081j счастлив поболтать о решении этой проблемы, ты участвуешь в разногласиях в сборнике рассказов?
https://discord.gg/7yKH3EU

не волнуйтесь, скоро разойдетесь, не знал, что есть один сборник рассказов: +1:

аналогичная проблема, у меня уже был core-js в моем проекте, и обновление до 3 (что мы все равно собирались сделать), похоже, не решает эту проблему.

это только у меня, если я посмотрю на репо core-js, web.dom.iterable не существует банкомата?

@ kelly-tock попробуйте найти точную версию, от которой зависит сборник рассказов, и посмотрите, поможет ли это.

Я думаю, что обнаружил проблему сейчас, поэтому мы просто выясняем, как исправить, нужно некоторое обсуждение, чтобы убедиться, что это не повторится снова с другой зависимостью.

для всех, кто хочет следить за моими успехами, мой текущий черновик (с расследованием / объяснением) - # 12312

попытался закрепить на 3.0.1, не повезло, поле, похоже, не существует. внутри установленных модулей сборника рассказов core-js устанавливается как 3.6.5, у которого также нет этого файла. сейчас буду следить за этой другой веткой. не могу обновить.

 "webpackFinal": (config)=> {
    config.resolve.alias['core-js/modules'] =  path.resolve(
            __dirname,
            '..',
            'node_modules/@storybook/core/node_modules/core-js/modules'
        );
    return config;
  }

Добавление кода в main.js решает мою проблему.

Я могу подтвердить решение @jefferscn . Я упростил это, но это то же самое:

config.resolve.alias['core-js/modules'] = '@storybook/core/node_modules/core-js/modules'

Вы должны проверить свой package.json или запустить npm ls core-js чтобы узнать, какую версию core-js вы используете.

Если ваш package.json ссылается на core-js меньше, чем 3.0.1 , то вам, вероятно, нужно удалить его и повторно запустить npm install .

Я смог исправить это, добавив

"resolutions": {
    "**/core-js": "^3.6.5"
}

на мой package.json , как описано в # 8267.

Я столкнулся с этой проблемой на 6, перешел на версию 5.3, через некоторое время столкнулся с другой версией этой проблемы, а затем нашел и реализовал исправление. Я подумал, что могу попробовать вернуться к 6-й версии, и, к счастью, она все еще работает.

Все ответы на добавление полей в конфигурацию Webpack у меня не сработали, но это, очевидно, сработало.

Я использую Gatsby, и, очевидно, глубоко внутри спрятана одна зависимость core-js@^2.4.0:

npm ls core-js

└─┬ [email protected]
  ├── [email protected]  deduped
  └─┬ [email protected]
    └─┬ [email protected]
      └─┬ [email protected]
        └──  core-js@^2.4.0

Добавление поля resolutions технически нарушает зависимость core-js для этой зависимости Gatsby / babel-runtime (дерево теперь говорит UNMET DEPENDENCY рядом с core-js@^2.4.0), но я еще не видел проблемы.

У меня была такая же проблема со stroybook v6 + React + Typescript, и это решило мою проблему

.storybook / main.js

const path = require('path');

module.exports = {
  stories: ['../src/**/*.stories.@(ts|tsx)'],
  addons: ['@storybook/addon-actions', '@storybook/addon-links', '@storybook/addon-docs'],
  webpackFinal: (config) => {
    config.module.rules.push({
      test: /\.(ts|tsx)$/,
      use: [
        {
          loader: 'babel-loader',
          options: {
            presets: ['babel-preset-react-app']
          }
        }
      ],
      include: path.resolve(__dirname, '../src'),
      exclude: /node_modules/,
    });
    return config;
  },
};

И .storybook / .babelrc
{ "presets": [ "babel-preset-react-app" ] }

И package.json
"babel-preset-react-app": "^9.1.2",

Для меня проблема заключалась в том, что я не сопоставил версию свойства @babel/preset-env option corejs с правильной.

package.json:
"core-js": "^3.6.5",

Решение:
.babelrc (или там, где живет ваша конфигурация babel)

[
    "@babel/preset-env",
    {
        "corejs": "3.6.5", <- make sure this version is the same as core-js version installed!
        ...
    }
],

Эй, тоже сталкиваюсь с этой проблемой. У меня есть монорепозиторий, и я импортирую много ресурсов из общей папки за пределами основного приложения сборника рассказов. Мне пришлось установить core-js в эту общую папку, что было не идеально (несмотря на то, что он был установлен в папке сборника рассказов), и теперь я сталкиваюсь с другими проблемами.

Большая часть моей документации также является общедоступной, поэтому мне нужно импортировать mdx docs оттуда в приложение сборника рассказов, это также приводит к ошибкам, потому что сборник рассказов, похоже, считает, что общая папка должна быть там, где он импортирует ресурсы откуда это относится к этим документам.

Error: Can't resolve '@storybook/addon-docs/blocks' in '../shared/.storybook/documentation/... (один из многих)

main.js

stories: [
    '../stories/**/*.stories.mdx',
    '../stories/**/*.stories.@(js|mdx)',
    path.resolve(__dirname, '../../shared/.storybook/documentation/**/*.stories.mdx')
  ],

Я могу подтвердить решение @jefferscn . Я упростил это, но это то же самое:

config.resolve.alias['core-js/modules'] = '@storybook/core/node_modules/core-js/modules'

К сожалению, это не сработало для меня в проекте yarn 2 (berry), поскольку папка /node_modules/ напрямую недоступна. Мое основное приложение уже указывает core-js как явную зависимость

Ошибка у меня выглядит так:

 Error: Your application tried to access core-js, but it isn't declared in your dependencies; this makes the require call ambiguous and unsound.

Эта проблема может быть связана (но я не уверен).

https://github.com/yarnpkg/berry/issues/947#issue -564792093

 "webpackFinal": (config)=> {
    config.resolve.alias['core-js/modules'] =  path.resolve(
            __dirname,
            '..',
            'node_modules/@storybook/core/node_modules/core-js/modules'
        );
    return config;
  }

Добавление кода в main.js решает мою проблему.

У меня было это исправление, и оно работало, но я обновил все свои пакеты сегодня, и в итоге я снова получал ошибки core-js при попытке запустить сборник рассказов. Я удалил вышеуказанное исправление, и все снова работает.

Я особо не разбирался в этом, но заметил одну вещь: раньше у меня была версия 6.0.21, которая содержала это в package.json:

  "_phantomChildren": {
    "p-limit": "2.3.0",
    "picomatch": "2.2.2"
  },

6.0.26 содержит:

  "_phantomChildren": {
    "core-js": "3.6.5",
    "p-limit": "2.3.0",
    "picomatch": "2.2.2"
  },

Я не уверен, как именно здесь все решается, не читая немного, но что-то определенно произошло с тем, как решается core-js. Однако не уверен, что это относится к конкретному проекту.

 "webpackFinal": (config)=> {
    config.resolve.alias['core-js/modules'] =  path.resolve(
            __dirname,
            '..',
            'node_modules/@storybook/core/node_modules/core-js/modules'
        );
    return config;
  }

Добавление кода в main.js решает мою проблему.

У меня было это исправление, и оно работало, но я обновил все свои пакеты сегодня, и в итоге я снова получал ошибки core-js при попытке запустить сборник рассказов. Я удалил вышеуказанное исправление, и все снова работает.

Я особо не разбирался в этом, но заметил одну вещь: раньше у меня была версия 6.0.21, которая содержала это в package.json:

  "_phantomChildren": {
    "p-limit": "2.3.0",
    "picomatch": "2.2.2"
  },

6.0.26 содержит:

  "_phantomChildren": {
    "core-js": "3.6.5",
    "p-limit": "2.3.0",
    "picomatch": "2.2.2"
  },

Я не уверен, как именно здесь все решается, не читая немного, но что-то определенно произошло с тем, как решается core-js. Однако не уверен, что это относится к конкретному проекту.

Потому что ваш проект теперь имеет ту же версию core-js со сборниками рассказов.

Мне пришлось изменить мой файл .storybook/main.js на:

    webpackFinal: async config => {
        return {
            ...config,
            resolve: {
                alias: {
                    'core-js/modules': '@storybook/core/node_modules/core-js/modules',
                    'core-js/features': '@storybook/core/node_modules/core-js/features',
                },
            },
        };

Вот мой случай. Как только добавляется зависимость graphql-tools для имитации данных GraphQL ( на основе этого аккуратного подхода из полосы ), возникает эта ошибка.

Все, что мне нужно сделать, это добавить этот фрагмент кода в любую историю (или файл preview.js):

import {
  makeExecutableSchema,
  addMockFunctionsToSchema
} from 'graphql-tools';

const schemaString = `
  type Todo { id: ID, text: String, completed: Boolean }
  type User { id: ID, name: String }
  type Query { todoItems: [Todo] }
  # ... other types here
`;

// Make a GraphQL schema with no resolvers
const schema = makeExecutableSchema({ typeDefs: schemaString });

Появляется куча ошибок начиная с:

ERROR in ./node_modules/@graphql-tools/git-loader/index.esm.js
Module not found: Error: Can't resolve 'child_process' in 'xxx/node_modules/@graphql-tools/git-loader'

ERROR in ./node_modules/@graphql-tools/load-files/node_modules/@nodelib/fs.stat/out/adapters/fs.js
Module not found: Error: Can't resolve 'fs' in '/xxx/node_modules/@graphql-tools/load-files/node_modules/@nodelib/fs.stat/out/adapters'

ERROR in ./node_modules/@graphql-tools/load-files/node_modules/fast-glob/out/settings.js
Module not found: Error: Can't resolve 'fs' in '/xxx/node_modules/@graphql-tools/load-files/node_modules/fast-glob/out'

...

Выполнение команды npm ls core-js . Единственный вывод, который содержит core-js <v3, таков:

└─┬ [email protected]
  └─┬ @graphql-tools/[email protected]
    └─┬ [email protected]
      └─┬ [email protected]
        └── [email protected]

Ни одно из решений не помогло мне. Не удалось выполнить разрешение в package.json :(

"resolutions": {
    "styled-components": "^5",
    "**/core-js": "^3.6.5"
  }

@ dejanvasic85 Вы пробовали использовать флаг --no-dll ?

Я сделал @shilman.

Я также попробовал все предложенные решения в этой проблеме с Next.js, и ни одно из них не сработало.

Это делает v6 непригодным для использования.

@epiqueras у вас есть

Устанавливаю в новый проект Next.js.

Обходной путь https://github.com/storybookjs/storybook/issues/11255#issuecomment -713083086

Я использую версию Storybook из веб-компонентов.

Пожалуйста, попробуйте обновить до 6.1

npx sb upgrade --prerelease

Все еще сломан.

У меня он все еще не работает, и это связано с новым приложением Ember.js, в котором пока нет ничего, кроме Storybook.

Проблема возникает, когда любая имеющаяся у вас зависимость использует core-js@<3 .

Кажется, что Storybook заставляет все зависимости использовать одну и ту же версию.

У меня тоже есть эта проблема.

Модуль не найден: ошибка: не удается разрешить "core-js / modules / web.dom.iterable"

Интересно то, что это происходит при наличии этого в .babelrc :

["@babel/plugin-proposal-class-properties", { "loose": true }],
["@babel/plugin-proposal-private-methods", { "loose": true }]

Когда я удаляю { "loose": true } из второго,

["@babel/plugin-proposal-class-properties", { "loose": true }],
["@babel/plugin-proposal-private-methods"]

Получил только предупреждение, но на открывшемся сайте вижу только раздел «Введение».

Ошибка при сборке модуля [...] конфигурация режима «свободный» должна быть одинаковой для @ babel / plugin-offer-class-properties, @ babel / plugin-offer-private-methods и @ babel / plugin-offer-private-property -в-объекте (когда они включены).

Использование Storybook 6.1.0-beta.3.

Также при удалении { "loose": true } я получил

Ошибка: не удается решить "core-js / modules / web.dom.iterable"

Обновление :
У меня были старые версии @babel/preset-env и плагины @babel/plugin* . После обновления / перехода с 7.1. * На 7.12. * Заработало.

Для людей, которые все еще сталкиваются с этим, мы заблокированы babel / babel # 12035

Проблема теперь довольно хорошо изучена и находится на грани Вавилонского. Возможны обходные пути, но они будут довольно сложными и хакерскими, поэтому я надеюсь, что Babel сможет просто исправить это на своей стороне или, по крайней мере, сказать нам, как это сделать.

Похоже, это исправлено в babel / babel-polyfills # 40

редактировать:

над этим работают # 13055

У меня есть библиотека компонентов Vue с нулевыми зависимостями, необходимыми для core-js , и она по-прежнему вызывает ошибку
Module not found: Error: Can't resolve 'core-js/modules/web.dom.iterable'
После того, как я потратил более 1 часа на установку babel , core-js и попробовал все обходные пути, он все равно дал мне ошибку 🤦

Имею следующее:

"@babel/core": "^7.12.9",
    "@babel/plugin-proposal-optional-chaining": "^7.12.1",
    "@storybook/addon-actions": "^6.1.8",
    "@storybook/addon-essentials": "^6.1.8",
    "@storybook/addon-knobs": "^5.0.0",
    "@storybook/addon-links": "^6.1.8",
    "@storybook/addon-notes": "^5.0.0",
    "@storybook/vue": "^6.1.8",
    "@types/jest": "^26.0.15",
    "@vue/cli-plugin-babel": "^3.10.0",
    "@vue/cli-plugin-eslint": "^3.10.0",
    "@vue/cli-plugin-unit-jest": "^3.10.0",
    "@vue/cli-service": "^3.10.0",
    "@vue/eslint-config-prettier": "^4.0.1",
    "@vue/test-utils": "^1.0.0-beta.29",
    "babel-eslint": "^10.0.1",
    "babel-jest": "^23.6.0",
    "babel-loader": "^8.2.2",

Zoinks !! Я только что выпустил https://github.com/storybookjs/storybook/releases/tag/v6.2.0-alpha.0, содержащий PR № 13055, который ссылается на эту проблему. Перейдите сегодня на тег @next NPM, чтобы попробовать!

npx sb upgrade --prerelease

Закрытие этого вопроса. Пожалуйста, откройте заново, если считаете, что еще нужно сделать.

Можно ли его обновить, когда он будет полностью выпущен?

@shilman Я только что обновил свой аддон Ember до предварительной версии, и все работает!

@shilman У меня все еще не работает по очень странной причине. Запуск yarn storybook вызывает кучу ошибок, связанных с полифилом core-js. Например:

ERROR in ./.storybook/preview.js-generated-config-entry.js
Module not found: Error: Can't resolve 'core-js/modules/es.symbol' in ...
 @ ./.storybook/preview.js-generated-config-entry.js 3:0-36
 @ multi ./node_modules/@storybook/vue/node_modules/@storybook/core/dist/server/common/polyfills.js ./node_modules/@storybook/vue/node_modules/@storybook/core/dist/server/preview/globals.js ./.storybook/storybook-init-framework-entry.js ./node_modules/@storybook/addon-docs/dist/frameworks/common/config.js-generated-other-entry.js ./node_modules/@storybook/addon-docs/dist/frameworks/vue/config.js-generated-other-entry.js ./node_modules/@storybook/addon-links/dist/preset/addDecorator.js-generated-other-entry.js ./node_modules/@storybook/addon-actions/dist/preset/addDecorator.js-generated-other-entry.js ./node_modules/@storybook/addon-actions/dist/preset/addArgs.js-generated-other-entry.js ./node_modules/@storybook/addon-backgrounds/dist/preset/addDecorator.js-generated-other-entry.js ./node_modules/@storybook/addon-backgrounds/dist/preset/addParameter.js-generated-other-entry.js ./.storybook/preview.js-generated-config-entry.js ./.storybook/generated-stories-entry.js (webpack)-hot-middleware/client.js?reload=true&quiet=false&noInfo=undefined

Мне нужно сделать обходной путь в main.js со следующим:

webpackFinal: (config) => {
    config.resolve.alias["core-js/modules"] =
      "@storybook/core/node_modules/core-js/modules";
    config.resolve.alias["core-js/features"] =
      "@storybook/core/node_modules/core-js/features";
    return config;
  },

Это происходит, когда у меня core-js версия конкретно указывает на 2.6.9.

По-прежнему не работает. Только что обновился патчем 6.2.0-alpha.1

В этом выпуске наконец-то исправлено это для Storybook нашей библиотеки компонентов - спасибо!

Для тех из вас, чьи проекты НЕ исправлены с помощью 6.2.0-alpha.1 , несколько предложений:

• Попробуйте удалить node_modules и / или файлы блокировки и переустановить?
• Попробуйте удалить любые обходные пути, которые вы добавляли ранее

Если это все еще не помогает, возможно, вы разместите ссылку на свое репо, и мы сможем взглянуть и увидеть, что происходит. Спасибо за ваше терпение!

Эй, спасибо за продолжение работы над этим. К сожалению, обновление до 6.2.0-alpha.1 в частном репо не исправило истории, у нас не было обходных путей для удаления. Я обновлю здесь, если у меня будет минимальное репо, содержащее проблему.

Репозиторий представляет собой смесь JS / typescript, управляемую yarn 2 (berry), и имеет версию core-js 3.0.1 указанную на корневом уровне package.json . Большинство ошибок имеют вид

Module not found: Error: Your application tried to access core-js, but it isn't declared in your dependencies; this makes the require call ambiguous and unsound.

Required package: core-js (via "core-js/modules/es.string.iterator")
// path to some internal code