1. 程式人生 > >vue-cli中使用Less全域性變數,一次性匯入

vue-cli中使用Less全域性變數,一次性匯入

1、安裝sass-resources-loader

npm install sass-resources-loader --save-dev

2、新增函式

找到 build/utils.js 檔案,在 exports.cssLoaders 模組中加多一個函式
function lessResourceLoader() {
        var loaders = [
            cssLoader,
            'less-loader',
            {
                loader: 'sass-resources-loader'
, options: { resources: [ path.resolve(__dirname, '../src/resource/css/global/global.less'), ] } } ]; if (options.extract) { return ExtractTextPlugin.extract({ use
: loaders, fallback: 'vue-style-loader' }) } else { return ['vue-style-loader'].concat(loaders) } }
其中 '../src/resource/css/global/global.less' 路徑改成自己對應的檔案
然後後面將 return{} 塊中的 less: generateLoaders('less') 替換成上面自定義的函式 less: lessResourceLoader()

3、執行專案

執行專案
npm run dev