less

参考 antd 文档，可使用 modifyVars 覆盖变量：

  1. // webpack.config.js
  2. module.exports = {
  3.   rules: [{
  4.     test: /\.less$/,
  5.     use: [{
  6.       loader: 'style-loader',
  7.     }, {
  8.       loader: 'css-loader', // translates CSS into CommonJS
  9.     }, {
  10.       loader: 'less-loader', // compiles Less to CSS
  11.       options: {
  12.         modifyVars: {
  13.           'primary-color': '#1DA57A',
  14.           'link-color': '#1DA57A',
  15.           'border-radius-base': '2px',
  16.           // or
  17.           'hack': `true; @import "your-less-file-path.less";`, // Override with less file
  18.         },
  19.         javascriptEnabled: true,
  20.       },
  21.     }],
  22.     // ...other rules
  23.   }],
  24.   // ...other config
  25. }

sass

可使用 prependData：

  1. // webpack.config.js -> module.rules
  2. {
  3.   test: /\.scss$/,
  4.   use: [
  5.     'css-loader',
  6.     {
  7.       loader: 'sass-loader',
  8.       options: {
  9.         // 你也可以从一个文件读取，例如 `variables.scss`
  10.         // 如果 sass-loader 版本 < 8，这里使用 `data` 字段
  11.         prependData: `$color: red;`
  12.         // prependData: `@import "~@/assets/scss/variables.scss";`
  13.       }
  14.     }
  15.   ]
  16. }