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>

結果：