vant cli 如何使用 Less 提供的 modifyVars 对变量进行修改

[Mikasa33]

问题

不知如何正确修改变量，目前我是在项目根目录下创建了 webpack.config.js 文件，内容如下：

module.exports = {
  module: {
    rules: [
      {
        test: /\.less$/,
        use: [
          {
            loader: 'less-loader',
            options: {
              modifyVars: {
                red: '#fff',
              },
            },
          },
        ],
      },
    ],
  },
};

[chenjiahan]

就这种方法就可以哈，目前没提供其他方法

[Mikasa33]

emmm 但是这么写不生效，不知道还需不需要改其他东西

[MGsniper]

你需要先引入组件的less文件哦。我一开始也忘了引入了。

[Mikasa33]

感谢回复！我尝试了一下，可以覆盖自己写的 less 的变量值，但主要是想修改 vant 组件的默认颜色，目前还是没成功 :(

[zy017]

https://github.com/youzan/vant/blob/dev/src/style/var.less
这里面是vant样式的配置项，还有要注意的是要引入vant样式文件时，要引入less文件，不要引入css文件，官方文档默认引入的是css文件，你可以看一下vant文档中的定制主题

[chenjiahan]

楼上正解👍

[Mikasa33]

多谢帮助。
解决办法：我是在使用 vant 组件的地方同时引入对应的 less 文件

import { Button } from 'vant';
import 'vant/lib/button/style/less';

[qinwangjun]

@Mikasa33 感谢！对我有用！