vue-cli webpack配置中 如何启动less-loader sass-loader

 在vue-cli中构建的项目是可以使用less的,但是查看package.json可以发现,并没有less相关的插件,所以我们需要自行安装。

//第一步:安装
npm install less less-loader --save-dev
即通过npm安装less和less-loader,并记录到devDependencies中,因为这是我们在开发中使用的而非在生产中使用,所以就不将之记录在 dependencies 中。

 

//第二步:在配置文件中配置
 实际上如果我们通过vue-cli来构建项目,这一步是可以省略的。

 在webpack.dev.conf.js中,我们可以看到下面的代码:

  module: {
     // 默认是这样的 rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap, usePostCSS: true })
   //后面userPostCss去掉就启动less sass 了
    rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap })
  },
 即webpack.dev.conf.js在合并了webpack.base.conf.js的基础上又添加了dev环境下的module。 

  

猜你喜欢

转载自www.cnblogs.com/zhujiasheng/p/9080808.html