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的地址

 

你可能感兴趣的:(vue)