前言
最近在研究用storybook写UI库的说明文档，但是在跑sass的时候遇到了下面的报错。
1
2
3
4
5
6
7
8
9
10
| ERROR in ./src/components/g-input.vue?vue&type=style&index=0&id=711ebb04&lang=scss (./node_modules/vue-docgen-loader/lib??ref--13!./node_modules/style-loader/dist/cjs.js!./node_modules/css-loader/dist/cjs.js!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/sass-loader/dist/cjs.js!./node_modules/vue-loader/dist??ref--3!./src/components/g-input.vue?vue&type=style&index=0&id=711ebb04&lang=scss)
Module build failed (from ./node_modules/style-loader/dist/cjs.js):
TypeError: this.getOptions is not a function
at Object.loader (/Users/oyt/Downloads/story/node_modules/style-loader/dist/index.js:19:24)
@ ./src/components/g-input.vue?vue&type=style&index=0&id=711ebb04&lang=scss 1:0-370 1:0-370
@ ./src/components/g-input.vue
@ ./src/stories/card/index.stories.ts
@ ./src sync ^\.(?:(?:^|\/|(?:(?:(?!(?:^|\/)\.).)*?)\/)(?!\.)(?=.)[^/]*?\.stories\.(js|jsx|ts|tsx))$
@ ./generated-stories-entry.js
@ multi ./node_modules/@storybook/core-client/dist/esm/globals/polyfills.js ./node_modules/@storybook/core-client/dist/esm/globals/globals.js (webpack)-hot-middleware/client.js?reload=true&quiet=false&noInfo=undefined ./storybook-init-framework-entry.js ./node_modules/@storybook/addon-docs/dist/esm/frameworks/common/config.js-generated-config-entry.js ./node_modules/@storybook/addon-docs/dist/esm/frameworks/vue3/config.js-generated-config-entry.js ./node_modules/@storybook/vue3/dist/esm/client/preview/config-generated-config-entry.js ./node_modules/@storybook/addon-links/dist/esm/preset/addDecorator.js-generated-config-entry.js ./node_modules/@storybook/addon-actions/dist/esm/preset/addDecorator.js-generated-config-entry.js ./node_modules/@storybook/addon-actions/dist/esm/preset/addArgs.js-generated-config-entry.js ./node_modules/@storybook/addon-backgrounds/dist/esm/preset/addDecorator.js-generated-config-entry.js ./node_modules/@storybook/addon-backgrounds/dist/esm/preset/addParameter.js-generated-config-entry.js ./node_modules/@storybook/addon-measure/dist/esm/preset/addDecorator.js-generated-config-entry.js ./node_modules/@storybook/addon-outline/dist/esm/preset/addDecorator.js-generated-config-entry.js ./.storybook/preview.js-generated-config-entry.js ./generated-stories-entry.js
|
问题原因
在谷歌了一下之后发现大佬们说的下面的问题。
解决办法
修改package.json中对应版本如下
1
2
3
4
5
| {
"css-loader": "^5.1.1",
"sass-loader": "^10",
"style-loader": "^2.0.0"
}
|