vue.js 2.0中使用less

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vue.js 2.0中使用less相关的知识,希望对你有一定的参考价值。

说明,使用的是npm init webpack 项目名方式创建的项目,无需手动配置webpack

 

1.安装less依赖

npm install less less-loader --save

 

2.xx.vue组件中使用less

<style lang="less" rel="stylesheet/less">

.tab{
display:flex;
width:100%;
height:40px;
line-height:40px;
}
.tab .tab-item{
flex:1;
text-align:center;
&>a{display: block;
&.active{color: @color}
}
}
@color:red;
</style>
















以上是关于vue.js 2.0中使用less的主要内容,如果未能解决你的问题,请参考以下文章

使用带有渲染功能的 Vue.js 3 片段

Vue.js 2.0 生产环境部署

vue.js 2.0 通信最佳实践

我正在使用 Vue.js 2.0,我正在尝试从“子组件”发出事件

使用 vue.js 2.0 打开引导模式

Vue.js 2.0 Render 函数