Less学习----Vue中引入Less的方法

1. 安装

npm install less less-loader --save-dev
cnpm install less less-loader --save-dev //推荐使用

刚开始安装完成后，启动项目时会报错，不知道啥原因，我又重新安装了几次就好了

2. 引入

<style lang="less" scoped>
	@import "你要引入的less文件的位置"
</style>

lang = “less” 表示在这里可以写入less代码了
scoped 表示只在这个作用域有效


3. 检测是否已经成功引入

@border : 1px solid red;
.container{
  width:400px;
  height:400px;
  border:@border;
  margin:0 auto;
  line-height: 400px;

  .content{
    width:300px;
    height:300px ;
    border:@border;
    margin: 50px auto;
  }
}

上图显示已经成功引入