less引入到Vue处理Css预编译

时间:2022-07-24
本文章向大家介绍less引入到Vue处理Css预编译，主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项，具有一定的参考价值，需要的朋友可以参考一下。

一、安装less和less-loader

npm install less less-loader --save

二、在build/webpack.base.conf.js文件添加

 {
        test: /.less$/,
        loader: 'style-loader!css-loader!less-loader'
      },

三、在组件中引入 lang="less"

<style scoped lang="less">
@color: #088;
div {
  width: 200px;
  height: 200px;
  background: @color;
  display: flex;
  span {
    font-size: 30px;
    color: #fff;
    margin: auto;
  }
}
</style>

随机文章
Javascript知识点必读
最近更新