最新版本的故事书不适用于Angular2 +项目

时间:2018-07-17 11:39:17

标签: angular storybook

我是Storybook的初学者。我正在用它来通过隔离Angular6项目中的组件来测试我的组件。但是面对问题,同时尝试运行故事书。 我的Angular-CLI版本如下:

Angular CLI: 1.6.8
Node: 10.6.0
OS: darwin x64
Angular: 5.2.11
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

@angular/cli: 1.6.8
@angular-devkit/build-optimizer: 0.0.42
@angular-devkit/core: 0.0.29
@angular-devkit/schematics: 0.0.52
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.9.8
@schematics/angular: 0.1.17
typescript: 2.5.3
webpack: 3.10.0

当尝试将故事书用于新创建的Angular6项目时,当我运行命令“ npm run storybook”时,在终端上出现以下错误。请帮助我解决问题。我无法弄清楚该问题的解决方法。

BHUKRK1678D:StorybookPOC sonaliswarjeeta.d$ npm run storybook

> storybook-poc@0.0.0 storybook /Users/sonaliswarjeeta.d/StorybookPOC
> start-storybook -p 6006

info @storybook/angular v3.4.8
info 
exec: fatal: No such remote 'origin'

info => Loading custom addons config.
info => Loading angular-cli config.
info => Get angular-cli webpack config.
info => Using default webpack setup based on "angular-cli".
webpack built e788af976b4485eddee8 in 17840ms                                                                                                                                   
Hash: e788af976b4485eddee8
Version: webpack 3.12.0
Time: 17840ms
                   Asset     Size  Chunks  Chunk Names
static/manager.bundle.js  2.87 MB       0  manager
static/preview.bundle.js   671 kB       1  preview
static/styles.bundle.js  38.3 kB       2  styles
static/manager.bundle.js.map  3.49 MB       0  manager
static/preview.bundle.js.map   793 kB       1  preview
static/styles.bundle.js.map  43.6 kB       2  styles
[77] ./node_modules/global/window.js 232 bytes {0} [built]
[93] (webpack)/buildin/module.js 517 bytes {0} {1} [built]
[148] ./node_modules/@storybook/angular/dist/server/config/polyfills.js 74 bytes {0} {1} [built]
[221] ./node_modules/@storybook/angular/dist/server/config/angular-polyfills.js 110 bytes {0} {1} [built]
[437] multi ./.storybook/addons.js ./node_modules/@storybook/angular/dist/server/config/polyfills.js ./node_modules/@storybook/core/dist/client/manager/index.js 52 bytes {0} [built]
[438] ./.storybook/addons.js 1.4 kB {0} [built] [failed] [1 error]
[439] ./node_modules/@storybook/core/dist/client/manager/index.js 423 bytes {0} [built]
[804] multi ./node_modules/@storybook/angular/dist/server/config/polyfills.js ./node_modules/@storybook/angular/dist/server/config/globals.js ./node_modules/webpack-hot-middleware/client.js?reload=true ./.storybook/config.js 64 bytes {1} [built]
[805] ./node_modules/@storybook/angular/dist/server/config/globals.js 107 bytes {1} [built]
[806] ./node_modules/webpack-hot-middleware/client.js?reload=true 7.77 kB {1} [built]
[817] ./node_modules/webpack-hot-middleware/process-update.js 4.33 kB {1} [built]
[818] ./.storybook/config.js 1.4 kB {1} [built] [failed] [1 error]
[819] multi ./src/styles.css 28 bytes {2} [built]
[820] ./src/styles.css 1.09 kB {2} [built]
[822] ./node_modules/style-loader/addStyles.js 6.91 kB {2} [built]
+ 808 hidden modules

ERROR in ./.storybook/addons.js
Module build failed: Error: Cannot find module 'babel-core'
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:581:15)
at Function.Module._load (internal/modules/cjs/loader.js:507:25)
at Module.require (internal/modules/cjs/loader.js:637:17)
at require (internal/modules/cjs/helpers.js:20:18)
at Object.<anonymous> (/Users/sonaliswarjeeta.d/StorybookPOC/node_modules/babel-loader/lib/index.js:3:13)
at Module._compile (internal/modules/cjs/loader.js:689:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:700:10)
at Module.load (internal/modules/cjs/loader.js:599:32)
at tryModuleLoad (internal/modules/cjs/loader.js:538:12)
at Function.Module._load (internal/modules/cjs/loader.js:530:3)
at Module.require (internal/modules/cjs/loader.js:637:17)
at require (internal/modules/cjs/helpers.js:20:18)
at loadLoader (/Users/sonaliswarjeeta.d/StorybookPOC/node_modules/loader-runner/lib/loadLoader.js:13:17)
at iteratePitchingLoaders (/Users/sonaliswarjeeta.d/StorybookPOC/node_modules/loader-runner/lib/LoaderRunner.js:169:2)
at runLoaders (/Users/sonaliswarjeeta.d/StorybookPOC/node_modules/loader-runner/lib/LoaderRunner.js:362:2)
at NormalModule.doBuild (/Users/sonaliswarjeeta.d/StorybookPOC/node_modules/@storybook/core/node_modules/webpack/lib/NormalModule.js:182:3)
@ multi ./.storybook/addons.js ./node_modules/@storybook/angular/dist/server/config/polyfills.js ./node_modules/@storybook/core/dist/client/manager/index.js

ERROR in ./.storybook/config.js
Module build failed: Error: Cannot find module 'babel-core'
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:581:15)
at Function.Module._load (internal/modules/cjs/loader.js:507:25)
at Module.require (internal/modules/cjs/loader.js:637:17)
at require (internal/modules/cjs/helpers.js:20:18)
at Object.<anonymous> (/Users/sonaliswarjeeta.d/StorybookPOC/node_modules/babel-loader/lib/index.js:3:13)
at Module._compile (internal/modules/cjs/loader.js:689:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:700:10)
at Module.load (internal/modules/cjs/loader.js:599:32)
at tryModuleLoad (internal/modules/cjs/loader.js:538:12)
at Function.Module._load (internal/modules/cjs/loader.js:530:3)
at Module.require (internal/modules/cjs/loader.js:637:17)
at require (internal/modules/cjs/helpers.js:20:18)
at loadLoader (/Users/sonaliswarjeeta.d/StorybookPOC/node_modules/loader-runner/lib/loadLoader.js:13:17)
at iteratePitchingLoaders (/Users/sonaliswarjeeta.d/StorybookPOC/node_modules/loader-runner/lib/LoaderRunner.js:169:2)
at runLoaders (/Users/sonaliswarjeeta.d/StorybookPOC/node_modules/loader-runner/lib/LoaderRunner.js:362:2)
at NormalModule.doBuild (/Users/sonaliswarjeeta.d/StorybookPOC/node_modules/@storybook/core/node_modules/webpack/lib/NormalModule.js:182:3)
@ multi ./node_modules/@storybook/angular/dist/server/config/polyfills.js ./node_modules/@storybook/angular/dist/server/config/globals.js ./node_modules/webpack-hot-middleware/client.js?reload=true ./.storybook/config.js
Child html-webpack-plugin for "iframe.html":
      Asset    Size  Chunks  Chunk Names
iframe.html  568 kB       0  
   [0] ./node_modules/html-webpack-plugin/lib/loader.js!./node_modules/@storybook/angular/dist/server/iframe.html.ejs 794 bytes {0} [built]
   [1] ./node_modules/lodash/lodash.js 540 kB {0} [built]
   [2] (webpack)/buildin/global.js 509 bytes {0} [built]
   [3] (webpack)/buildin/module.js 517 bytes {0} [built]
Child html-webpack-plugin for "index.html":
     Asset    Size  Chunks  Chunk Names
index.html  569 kB       0  
   [0] ./node_modules/html-webpack-plugin/lib/loader.js!./node_modules/@storybook/angular/dist/server/index.html.ejs 1.7 kB {0} [built]
   [1] ./node_modules/lodash/lodash.js 540 kB {0} [built]
   [2] (webpack)/buildin/global.js 509 bytes {0} [built]
   [3] (webpack)/buildin/module.js 517 bytes {0} [built]

1 个答案:

答案 0 :(得分:0)

解决方法是使用纱线。似乎webpack4(不适用于故事书)和NPM(强制wp4)存在问题。 https://github.com/storybooks/storybook/issues/3044#issuecomment-382312855