项目场景:
vue3在引入less的时候报错
问题描述
ERROR in ./src/views/home/index.vue?vue&type=style&index=0&id=5954443c&lang=less&scoped=true (./node_modules/css-loader/dist/cjs.js??clonedRuleSet-32.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-32.use[2]!./node_modules/less-loader/dist/cjs.js??clonedRuleSet-32.use[3]!./node_modules/style-resources-loader/lib/index.js??clonedRuleSet-32.use[4]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/views/home/index.vue?vue&type=style&index=0&id=5954443c&lang=less&scoped=true)
Module build failed (from ./node_modules/less-loader/dist/cjs.js):
原因分析:
@import '../../assets/styles/mixins.less'
^
Missing semi-colon or unrecognised media features on import
in D:\Vue3.0\rabbit-vue-pc\src\views\home\index.vue?vue&type=style&index=0&id=5954443c&lang=less&scoped=true (line 20, column 0)
@ ./node_modules/vue-style-loader/index.js??clonedRuleSet-32.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-32.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-32.use[2]!./node_modules/less-loader/dist/cjs.js??clonedRuleSet-32.use[3]!./node_modules/style-resources-loader/lib/index.js??clonedRuleSet-32.use[4]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/views/home/index.vue?vue&type=style&index=0&id=5954443c&lang=less&scoped=true 4:14-516 15:3-20:5 16:22-524
@ ./src/views/home/index.vue?vue&type=style&index=0&id=5954443c&lang=less&scoped=true 1:0-580 1:0-580。
解决方案:
在引入less的时候要加分号
Missing semi-colon