Vue.js项目引入less文件报错解决
最近用vue-cli+webpack构建项目时,当在app.vue或者其他组件中中引入less文件时会报错,如下所示:import '@/less/detail.less'报错如下:根据报错信息说是相关依赖babel-loader和vue-loader没有找到,但是我们npm i babel-loader vue-loader依然报错此信息。正常情况下在webpack的配置文件中已经配置
·
最近用vue-cli+webpack构建项目时,当在app.vue或者其他组件中中引入less文件时会报错,如下所示:
import '@/less/detail.less'
报错如下:
根据报错信息说是相关依赖babel-loader和vue-loader没有找到,但是我们npm i babel-loader vue-loader依然报错此信息。
正常情况下在webpack的配置文件中已经配置好可以引入css,less等文件,如果出现报错我们可以有两种方式解决。
1.src形式引入文件
<!-- 记住此时须严格按照文件相对路径 -->
<style lang="less" src="./less/comm.less"></style>
2.利用cnpm安装包
需要局部安装vue-style-loader,less-loader,css-loader,vue-loader和less包(需注意就算全局安装以上包仍需局部安装),即:cnpm i vue-style-loader less-loader css-loader vue-loader less
npm run dev即可正常运行
更多推荐
已为社区贡献4条内容
所有评论(0)