vue 组件webpack 坑;Module build failed;TypeError: Cannot read property ‘styles‘ of undefined

ERROR in ./components/lib/demo/src/main.vue
Module build failed (from ./node_modules/vue-loader/dist/index.js):
TypeError: Cannot read property 'styles' of undefined
    at Object.loader (/Users/dengkai/IdeaProjects/KevinDemo/mooc_ui/node_modules/vue-loader/dist/index.js:71:34)
 @ ./components/lib/demo/index.js 1:0-34 4:0-12 5:18-27 5:28-32 8:15-19

webpack 5.75.0 compiled with 2 errors in 129 ms
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! mooc_ui@0.1.0 build:js: `webpack --config ./webpack.component.js`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the mooc_ui@0.1.0 build:js script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/dengkai/.npm/_logs/2023-02-22T01_46_56_192Z-debug.log
dengkai@dengkaideMacBook-Pro mooc_ui % npm run build:js

> mooc_ui@0.1.0 build:js /Users/dengkai/IdeaProjects/KevinDemo/mooc_ui
> webpack --config ./webpack.component.js

files [ 'components/lib/card/index.js', 'components/lib/demo/index.js' ]
component card
component demo
{
  card: './components/lib/card/index.js',
  demo: './components/lib/demo/index.js'
}
asset card.umd.js 5.61 KiB [compared for emit] (name: card)
asset demo.umd.js 5.61 KiB [compared for emit] (name: demo)
runtime modules 1.95 KiB 8 modules
cacheable modules 334 bytes
  modules by path ./components/lib/card/ 167 bytes
    ./components/lib/card/index.js 128 bytes [built] [code generated]
    ./components/lib/card/src/main.vue 39 bytes [built] [code generated] [1 error]
  modules by path ./components/lib/demo/ 167 bytes
    ./components/lib/demo/index.js 128 bytes [built] [code generated]
    ./components/lib/demo/src/main.vue 39 bytes [built] [code generated] [1 error]

ERROR in ./components/lib/card/src/main.vue
Module build failed (from ./node_modules/vue-loader/dist/index.js):
TypeError: Cannot read property 'styles' of undefined
    at Object.loader (/Users/dengkai/IdeaProjects/KevinDemo/mooc_ui/node_modules/vue-loader/dist/index.js:71:34)
 @ ./components/lib/card/index.js 1:0-34 4:0-12 5:18-27 5:28-32 8:15-19

ERROR in ./components/lib/demo/src/main.vue
Module build failed (from ./node_modules/vue-loader/dist/index.js):
TypeError: Cannot read property 'styles' of undefined
    at Object.loader (/Users/dengkai/IdeaProjects/KevinDemo/mooc_ui/node_modules/vue-loader/dist/index.js:71:34)
 @ ./components/lib/demo/index.js 1:0-34 4:0-12 5:18-27 5:28-32 8:15-19

webpack 5.75.0 compiled with 2 errors in 127 ms
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! mooc_ui@0.1.0 build:js: `webpack --config ./webpack.component.js`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the mooc_ui@0.1.0 build:js script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/dengkai/.npm/_logs/2023-02-22T01_57_53_240Z-debug.log

这个问题与vue-loader 版本有关系;我vue 3.11.0 ,之前默认安装的vue-loader@17 把版本换成对应的vue-loader @15    就可以了

npm i vue-loader@15 -D

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

人谷子

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值