1.安装
npm i less less-loader -S
2.更改配置文件build/webpack.base.conf.js
在module.export暴露的对象中，为module的rules添加如下配置：
{
test: /\.less$/,
loader: "style-loader!css-loader!less-loader",
},
配置好后如下：
3.使用
在style标签上添加lang属性，指定使用的样式语法；
<style scoped lang='less'>
</style>
案例
代码：
<template>
<div class="hello">
<h1>{{ msg }}</h1>
<h2><span>测试</span></h2>
</div>
</template>
<script>
export default {
name: 'HelloWorld',
data () {
return {
msg: 'Welcome to Your Vue.js App'
}
}
}
</script>
<style scoped lang='less'>
h1, h2 {
font-weight: normal;
span{
color:red
}
}
</style>
效果：
