Сборник рассказов 5.3 с версией 2 пряжи - PullRequest
1 голос
/ 29 января 2020

В соответствии с требованиями проекта я настраиваю сборник рассказов 5.3 для разработки реагирующих компонентов. Я использую Yarn версии 2 в качестве менеджера пакетов. Я выполнил все шаги, упомянутые в сборнике рассказов tutorial . но при запуске сборника рассказов с использованием 'yarn storybook' он показывает ошибку ниже. То же самое работает нормально, если я переключаюсь на npm. После прочтения некоторых документов по 'пряже' я предполагаю (возможно, неправильно), что это происходит из-за функции Plug'n'Play в Yarn. Так есть какие-нибудь мысли о том, как это исправить?

Module not found: Error: Can't resolve 'babel-loader' in '/Users/vimal/HDD/Development/Design/testspace/taskbox'
 @ multi ./.yarn/$$virtual/@storybook-core-virtual-3f1196b7f0/0/cache/@storybook-core-npm-5.3.9-d2e9ade828-1.zip/node_modules/@storybook/core/dist/server/common/polyfills.js ./.yarn/$$virtual/@storybook-core-virtual-3f1196b7f0/0/cache/@storybook-core-npm-5.3.9-d2e9ade828-1.zip/node_modules/@storybook/core/dist/server/preview/globals.js ./.storybook/generated-entry.js ./.yarn/cache/webpack-hot-middleware-npm-2.25.0-b59f3763d7-1.zip/node_modules/webpack-hot-middleware/client.js?reload=true&quiet=true main[0]

ERROR in multi ./.yarn/$$virtual/@storybook-core-virtual-3f1196b7f0/0/cache/@storybook-core-npm-5.3.9-d2e9ade828-1.zip/node_modules/@storybook/core/dist/server/common/polyfills.js ./.yarn/$$virtual/@storybook-core-virtual-3f1196b7f0/0/cache/@storybook-core-npm-5.3.9-d2e9ade828-1.zip/node_modules/@storybook/core/dist/server/preview/globals.js ./.storybook/generated-entry.js ./.yarn/cache/webpack-hot-middleware-npm-2.25.0-b59f3763d7-1.zip/node_modules/webpack-hot-middleware/client.js?reload=true&quiet=true
Module not found: Error: Can't resolve 'babel-loader' in '/Users/vimal/HDD/Development/Design/testspace/taskbox'
 @ multi ./.yarn/$$virtual/@storybook-core-virtual-3f1196b7f0/0/cache/@storybook-core-npm-5.3.9-d2e9ade828-1.zip/node_modules/@storybook/core/dist/server/common/polyfills.js ./.yarn/$$virtual/@storybook-core-virtual-3f1196b7f0/0/cache/@storybook-core-npm-5.3.9-d2e9ade828-1.zip/node_modules/@storybook/core/dist/server/preview/globals.js ./.storybook/generated-entry.js ./.yarn/cache/webpack-hot-middleware-npm-2.25.0-b59f3763d7-1.zip/node_modules/webpack-hot-middleware/client.js?reload=true&quiet=true main[1]

ERROR in multi ./.yarn/$$virtual/@storybook-core-virtual-3f1196b7f0/0/cache/@storybook-core-npm-5.3.9-d2e9ade828-1.zip/node_modules/@storybook/core/dist/server/common/polyfills.js ./.yarn/$$virtual/@storybook-core-virtual-3f1196b7f0/0/cache/@storybook-core-npm-5.3.9-d2e9ade828-1.zip/node_modules/@storybook/core/dist/server/preview/globals.js ./.storybook/generated-entry.js ./.yarn/cache/webpack-hot-middleware-npm-2.25.0-b59f3763d7-1.zip/node_modules/webpack-hot-middleware/client.js?reload=true&quiet=true
Module not found: Error: Can't resolve 'babel-loader' in '/Users/vimal/HDD/Development/Design/testspace/taskbox'
 @ multi ./.yarn/$$virtual/@storybook-core-virtual-3f1196b7f0/0/cache/@storybook-core-npm-5.3.9-d2e9ade828-1.zip/node_modules/@storybook/core/dist/server/common/polyfills.js ./.yarn/$$virtual/@storybook-core-virtual-3f1196b7f0/0/cache/@storybook-core-npm-5.3.9-d2e9ade828-1.zip/node_modules/@storybook/core/dist/server/preview/globals.js ./.storybook/generated-entry.js ./.yarn/cache/webpack-hot-middleware-npm-2.25.0-b59f3763d7-1.zip/node_modules/webpack-hot-middleware/client.js?reload=true&quiet=true main[3]

ERROR in multi ./.yarn/$$virtual/@storybook-core-virtual-3f1196b7f0/0/cache/@storybook-core-npm-5.3.9-d2e9ade828-1.zip/node_modules/@storybook/core/dist/server/common/polyfills.js ./.yarn/$$virtual/@storybook-core-virtual-3f1196b7f0/0/cache/@storybook-core-npm-5.3.9-d2e9ade828-1.zip/node_modules/@storybook/core/dist/server/preview/globals.js ./.storybook/generated-entry.js ./.yarn/cache/webpack-hot-middleware-npm-2.25.0-b59f3763d7-1.zip/node_modules/webpack-hot-middleware/client.js?reload=true&quiet=true
Module not found: Error: Can't resolve 'babel-loader' in '/Users/vimal/HDD/Development/Design/testspace/taskbox'
 @ multi ./.yarn/$$virtual/@storybook-core-virtual-3f1196b7f0/0/cache/@storybook-core-npm-5.3.9-d2e9ade828-1.zip/node_modules/@storybook/core/dist/server/common/polyfills.js ./.yarn/$$virtual/@storybook-core-virtual-3f1196b7f0/0/cache/@storybook-core-npm-5.3.9-d2e9ade828-1.zip/node_modules/@storybook/core/dist/server/preview/globals.js ./.storybook/generated-entry.js ./.yarn/cache/webpack-hot-middleware-npm-2.25.0-b59f3763d7-1.zip/node_modules/webpack-hot-middleware/client.js?reload=true&quiet=true main[2]

ERROR in   Error: Child compilation failed:
  Module not found: Error: Can't resolve 'babel-loader' in '/Users/vimal/HDD/Development/Design/testspace/taskbox':
  Error: Can't resolve 'babel-loader' in '/Users/vimal/HDD/Development/Design/testspace/taskbox'
  Module not found: Error: Can't resolve 'babel-loader' in '/Users/vimal/HDD/Development/Design/testspace/taskbox':
  Error: Can't resolve 'babel-loader' in '/Users/vimal/HDD/Development/Design/testspace/taskbox'

  - compiler.js:141 
    [html-webpack-plugin-npm-4.0.0-beta.5-9fc0a86688-1.zip]/[html-webpack-plugin]/lib/compiler.js:141:18

  - Compiler.js:343 
    [webpack-npm-4.41.5-ec6f53e9d3-1.zip]/[webpack]/lib/Compiler.js:343:11

  - Compiler.js:681 
    [webpack-npm-4.41.5-ec6f53e9d3-1.zip]/[webpack]/lib/Compiler.js:681:15


  - Hook.js:154 AsyncSeriesHook.lazyCompileHook
    [tapable-npm-1.1.3-f1c2843426-1.zip]/[tapable]/lib/Hook.js:154:20

  - Compiler.js:678 
    [webpack-npm-4.41.5-ec6f53e9d3-1.zip]/[webpack]/lib/Compiler.js:678:31


  - Hook.js:154 AsyncSeriesHook.lazyCompileHook
    [tapable-npm-1.1.3-f1c2843426-1.zip]/[tapable]/lib/Hook.js:154:20

  - Compilation.js:1423 
    [webpack-npm-4.41.5-ec6f53e9d3-1.zip]/[webpack]/lib/Compilation.js:1423:35


  - Hook.js:154 AsyncSeriesHook.lazyCompileHook
    [tapable-npm-1.1.3-f1c2843426-1.zip]/[tapable]/lib/Hook.js:154:20

  - Compilation.js:1414 
    [webpack-npm-4.41.5-ec6f53e9d3-1.zip]/[webpack]/lib/Compilation.js:1414:32


  - Hook.js:154 AsyncSeriesHook.lazyCompileHook
    [tapable-npm-1.1.3-f1c2843426-1.zip]/[tapable]/lib/Hook.js:154:20

  - Compilation.js:1409 
    [webpack-npm-4.41.5-ec6f53e9d3-1.zip]/[webpack]/lib/Compilation.js:1409:36



Child HtmlWebpackCompiler:
                          Asset     Size               Chunks  Chunk Names
    __child-HtmlWebpackPlugin_0  536 KiB  HtmlWebpackPlugin_0  HtmlWebpackPlugin_0
    Entrypoint HtmlWebpackPlugin_0 = __child-HtmlWebpackPlugin_0
    [./.yarn/$$virtual/html-webpack-plugin-virtual-8c0fe702c5/0/cache/html-webpack-plugin-npm-4.0.0-beta.5-9fc0a86688-1.zip/node_modules/html-webpack-plugin/lib/loader.js!./.yarn/$$virtual/@storybook-core-virtual-3f1196b7f0/0/cache/@storybook-core-npm-5.3.9-d2e9ade828-1.zip/node_modules/@storybook/core/dist/server/templates/index.ejs] 2.15 KiB {HtmlWebpackPlugin_0} [built]
    [./.yarn/cache/lodash-npm-4.17.15-566d9324f7-1.zip/node_modules/lodash/lodash.js] 528 KiB {HtmlWebpackPlugin_0} [built]

    ERROR in ./.yarn/cache/lodash-npm-4.17.15-566d9324f7-1.zip/node_modules/lodash/lodash.js
    Module not found: Error: Can't resolve 'babel-loader' in '/Users/vimal/HDD/Development/Design/testspace/taskbox'
     @ ./.yarn/cache/lodash-npm-4.17.15-566d9324f7-1.zip/node_modules/lodash/lodash.js 1:0-96
     @ ./.yarn/$$virtual/html-webpack-plugin-virtual-8c0fe702c5/0/cache/html-webpack-plugin-npm-4.0.0-beta.5-9fc0a86688-1.zip/node_modules/html-webpack-plugin/lib/loader.js!./.yarn/$$virtual/@storybook-core-virtual-3f1196b7f0/0/cache/@storybook-core-npm-5.3.9-d2e9ade828-1.zip/node_modules/@storybook/core/dist/server/templates/index.ejs

    ERROR in ./.yarn/cache/lodash-npm-4.17.15-566d9324f7-1.zip/node_modules/lodash/lodash.js
    Module not found: Error: Can't resolve 'babel-loader' in '/Users/vimal/HDD/Development/Design/testspace/taskbox'
     @ ./.yarn/cache/lodash-npm-4.17.15-566d9324f7-1.zip/node_modules/lodash/lodash.js 1:0-96
     @ ./.yarn/$$virtual/html-webpack-plugin-virtual-8c0fe702c5/0/cache/html-webpack-plugin-npm-4.0.0-beta.5-9fc0a86688-1.zip/node_modules/html-webpack-plugin/lib/loader.js!./.yarn/$$virtual/@storybook-core-virtual-3f1196b7f0/0/cache/@storybook-core-npm-5.3.9-d2e9ade828-1.zip/node_modules/@storybook/core/dist/server/templates/index.ejs

WARN Broken build, fix the error above.
WARN You may need to refresh the browser.

пакет. json выглядит ниже

{
  "name": "Sbook",
  "scripts": {
    "storybook": "start-storybook"
  },
  "devDependencies": {
    "@babel/core": "^7.8.3",
    "@storybook/react": "^5.3.9",
    "babel-loader": "^8.0.6"
  },
  "dependencies": {
    "react": "^16.12.0",
    "react-dom": "^16.12.0"
  }
}

1 Ответ

0 голосов
/ 15 апреля 2020

Это на самом деле вызвано тем, что Storybook не поддерживает Yarn 2 в версиях, более ранних, чем v6.0.0 (на момент написания этой статьи еще альфа-версия).

Существует проблема, связанная со статусом поддержки Yarn 2 здесь

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

Вот тестовое репо , содержащее пошаговое руководство по действиям, которые необходимо предпринять для установки сборника рассказов с пряжей 2. Как жизнеспособная альтернатива, поддерживающая PnP и имеет CLI, аналогичный NPM Я бы предложил P NPM

...