码迷,mamicode.com
首页 > 其他好文 > 详细

vue项目中使用less

时间:2020-04-23 10:38:21      阅读:478      评论:0      收藏:0      [点我收藏+]

标签:mic   直接   order   image   code   ade   less   技术   load   

1.安装less less-loader

npm i -D less less-loader

2.在 .vue文件中使用lang="less"和@import

// home.lessc
@base-color: #39c;
@part-color: #3c9;
<style lang="less">
@import ‘./home.less‘;
.triangle {
  width: 0;
  height: 0;
  margin: 20px;
  border: 40px solid;
  border-color: @base-color transparent transparent transparent;
}
</style>

或者直接在该.vue的style中声明自定义样式:

<style lang="less">
 @base-color: #39c;
.triangle {
  width: 0;
  height: 0;
  margin: 20px;
  border: 40px solid;
  border-color: @base-color transparent transparent transparent;
}
</style>

技术图片

 

vue项目中使用less

标签:mic   直接   order   image   code   ade   less   技术   load   

原文地址:https://www.cnblogs.com/ceceliahappycoding/p/12758940.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!