vue脚手架生成的项目让它支持less预处理器

安装

减少开销

less-loader --seave-dev

安装less依赖，npm install less less-loader --save

第二步：在配置文件中配置

通过VUE-CLI 来构建项目，这一步是可以省略的。

在webpack.dev.conf.js 中，可以看到下面的代码：

装成功后，打开build / webpack.base.conf.js ，在module.exports = 的对象的module.rules 后面添加一段    

 

 

module.exports= {

 

    module: {

        rules: [

       

          {

            test: /\.less$/,

            loader: "style-loader!css-loader!less-loader",

          }

        ]

    }

}

 

在代码中的风格标签中加上lang = “less” 属性即可〜  

< style scoped lang = “less” >

 

</ style >

GitHub的地址