vue 修改框架less变量

以vant框架为例,vue项目以less作为css处理器:

less/var-reset.less

@import '~vant/lib/index.less';

// Color variables 重写变量值
@blue: #1989fa;
@orange: #000;
@green: #cccccc;

vue入口文件:

import vant from 'vant';
import '../../less/var-reset.less';  // 引入var-reaet.less文件
Vue.use(vant);

vue文件:

Hello admin
<van-button type="default">默认按钮</van-button>
<van-button type="primary">主要按钮</van-button>
<van-button type="warning">警告按钮</van-button>
<van-button type="danger">危险按钮</van-button>

结果:

posted @ 2018-12-19 15:05  ccyinghua  阅读(7506)  评论(1编辑  收藏  举报