vue cli 3 自動化匯入less配置

像variable.less、mixin.less需要全域性less檔案使用，每次匯入一次比較煩，可以參考vue cli 3 文件中的stylus設定全域性匯入

const path = require('path')

module.exports = {
    chainWebpack: config => {
        const types = ['vue-modules', 'vue', 'normal-modules', 'normal']
        types.forEach(type => addStyleResource(config.module.rule('less').oneOf(type)))
    },
    css: {
      loaderOptions: {
        less: {
          javascriptEnabled: true
        }
      }
    }
}

function addStyleResource(rule) {
    rule.use('style-resource')
        .loader('style-resources-loader')
        .options({
            patterns: [
                path.resolve(__dirname, 'src/styles/variable.less'), // 需要全域性匯入的less
                path.resolve(__dirname, 'src/styles/mixin.less'),
            ],
        })
}
複製程式碼