无法加载预设：级别 1 上的“@storybook/addon-info”
Failed to load preset: "@storybook/addon-info" on level 1
昨天一切都很好。
在我的 create-react-app 项目中安装 prop-types 后会出现此问题。
错误信息如下：
有人可以告诉我问题出在哪里以及如何解决吗？谢谢你。
非常感谢。
MacBook-Pro:storybook_test beike$ npm run storybook
> storybook_test@0.1.0 storybook /Users/storybook_test
> start-storybook -p 9009 -s public
info @storybook/react v5.3.18
info
info => Loading static files from: /Users/storybook_test/public .
info => Loading presets
WARN Failed to load preset: "@storybook/addon-info" on level 1
ERR! /Users/storybook_test/node_modules/@storybook/addon-info/dist/components/PropTable/style.css:1
ERR! .info-table {
ERR! ^
ERR!
ERR! SyntaxError: Unexpected token '.'
ERR! at wrapSafe (internal/modules/cjs/loader.js:1070:16)
ERR! at Module._compile (internal/modules/cjs/loader.js:1120:27)
ERR! at Object.Module._extensions..js (internal/modules/cjs/loader.js:1176:10)
ERR! at Module.load (internal/modules/cjs/loader.js:1000:32)
ERR! at Function.Module._load (internal/modules/cjs/loader.js:899:14)
ERR! at Module.require (internal/modules/cjs/loader.js:1042:19)
ERR! at require (internal/modules/cjs/helpers.js:77:18)
ERR! at Object.<anonymous> (/Users/storybook_test/node_modules/@storybook/addon-info/dist/components/PropTable/components/Table.js:12:1)
ERR! at Module._compile (internal/modules/cjs/loader.js:1156:30)
ERR! at Object.Module._extensions..js (internal/modules/cjs/loader.js:1176:10)
ERR! at Module.load (internal/modules/cjs/loader.js:1000:32)
ERR! at Function.Module._load (internal/modules/cjs/loader.js:899:14)
ERR! at Module.require (internal/modules/cjs/loader.js:1042:19)
ERR! at require (internal/modules/cjs/helpers.js:77:18)
ERR! at Object.<anonymous> (/Users/storybook_test/node_modules/@storybook/addon-info/dist/components/PropTable/index.js:37:37)
ERR! at Module._compile (internal/modules/cjs/loader.js:1156:30)
好像@storybook/addon-info is being superceded by @storybook/addon-docs. If it's possible for you, I would recommend you to try and replace the library. You can read more about it in this article.
如果您想要或需要坚持原来的设置，请尝试在 css 加载程序的 exlude 选项中添加 @storybook/addon-info 模块，或者调整 include 评论中提到的选项 here.
我没有测试它，但它会像这样：
const path = require('path')
module.exports = async ({ config }) => {
config.module.rules = config.module.rules.filter(f => f.test.toString() !== '/\.css$/')
config.module.rules.push({
test: /\.css$/,
exclude: /node_modules(?!\/@storybook\/addon-info)/,
loaders: ['style-loader', 'css-loader', 'postcss-loader'],
include: path.resolve(__dirname, '../src'),
})
return config
}
我遇到了同样的问题，但是因为我开始了这个项目，所以我只是切换了库。
昨天一切都很好。 在我的 create-react-app 项目中安装 prop-types 后会出现此问题。 错误信息如下： 有人可以告诉我问题出在哪里以及如何解决吗？谢谢你。 非常感谢。
MacBook-Pro:storybook_test beike$ npm run storybook
> storybook_test@0.1.0 storybook /Users/storybook_test
> start-storybook -p 9009 -s public
info @storybook/react v5.3.18
info
info => Loading static files from: /Users/storybook_test/public .
info => Loading presets
WARN Failed to load preset: "@storybook/addon-info" on level 1
ERR! /Users/storybook_test/node_modules/@storybook/addon-info/dist/components/PropTable/style.css:1
ERR! .info-table {
ERR! ^
ERR!
ERR! SyntaxError: Unexpected token '.'
ERR! at wrapSafe (internal/modules/cjs/loader.js:1070:16)
ERR! at Module._compile (internal/modules/cjs/loader.js:1120:27)
ERR! at Object.Module._extensions..js (internal/modules/cjs/loader.js:1176:10)
ERR! at Module.load (internal/modules/cjs/loader.js:1000:32)
ERR! at Function.Module._load (internal/modules/cjs/loader.js:899:14)
ERR! at Module.require (internal/modules/cjs/loader.js:1042:19)
ERR! at require (internal/modules/cjs/helpers.js:77:18)
ERR! at Object.<anonymous> (/Users/storybook_test/node_modules/@storybook/addon-info/dist/components/PropTable/components/Table.js:12:1)
ERR! at Module._compile (internal/modules/cjs/loader.js:1156:30)
ERR! at Object.Module._extensions..js (internal/modules/cjs/loader.js:1176:10)
ERR! at Module.load (internal/modules/cjs/loader.js:1000:32)
ERR! at Function.Module._load (internal/modules/cjs/loader.js:899:14)
ERR! at Module.require (internal/modules/cjs/loader.js:1042:19)
ERR! at require (internal/modules/cjs/helpers.js:77:18)
ERR! at Object.<anonymous> (/Users/storybook_test/node_modules/@storybook/addon-info/dist/components/PropTable/index.js:37:37)
ERR! at Module._compile (internal/modules/cjs/loader.js:1156:30)
好像@storybook/addon-info is being superceded by @storybook/addon-docs. If it's possible for you, I would recommend you to try and replace the library. You can read more about it in this article.
如果您想要或需要坚持原来的设置，请尝试在 css 加载程序的 exlude 选项中添加 @storybook/addon-info 模块，或者调整 include 评论中提到的选项 here.
我没有测试它，但它会像这样：
const path = require('path')
module.exports = async ({ config }) => {
config.module.rules = config.module.rules.filter(f => f.test.toString() !== '/\.css$/')
config.module.rules.push({
test: /\.css$/,
exclude: /node_modules(?!\/@storybook\/addon-info)/,
loaders: ['style-loader', 'css-loader', 'postcss-loader'],
include: path.resolve(__dirname, '../src'),
})
return config
}
我遇到了同样的问题，但是因为我开始了这个项目，所以我只是切换了库。