2***@qq.com
2***@qq.com
  • 发布:2020-11-03 14:42
  • 更新:2021-10-29 17:56
  • 阅读:2606

uniapp怎么配置使用全局导入less文件?

分类:uni-app

我试了以下几种配置vue.config.js来全局导入less,都不行:

const path = require('path')  
const CopyWebpackPlugin = require('copy-webpack-plugin')  

let stylePath = path.resolve(__dirname, 'assets/css/utils.less')  
module.exports = {  
    css: {  
            loaderOptions: {  
                less: {  
                    // additionalData: `@import "~@/assets/css/utils.less";`,  
                    globalVars:{  
                        "hack": `true; @import "${stylePath}"`  
                    }  
                }  
            }  
    },  
    chainWebpack: config =>{  
        config.module.rule('less').use('less-loader').loader('less-loader').tap(options=>{  
            options.additionalData = `@import "~@/assets/css/utils.less";`  
            return options  
        })  
    },  
    pluginOptions: {  
          'style-resources-loader': {  
            preProcessor: 'less',  
            patterns: [path.resolve(__dirname, "assets/css/utils.less")]   
          }  
    },  
}  

请问到底要怎么样配置才能全局导入less?

2020-11-03 14:42 负责人:无 分享
已邀请:
g***@qq.com

g***@qq.com - 个人承接PHP、uniapp项目,有案例,联系QQ 305475422

遇到同样问题,有解决方案吗?

这个这么重要吗

这个这么重要吗 - 这个不重要

使用style-resources-loader
npm install style-resources-loader -D
vue.config.js:

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

function addStyleResource(rule) {  
    rule.use('style-resource')  
        .loader('style-resources-loader')  
        .options({  
            patterns: [  
                path.resolve(__dirname, './src/assets/less/global.less'),  
            ],  
        })  
}

该问题目前已经被锁定, 无法添加新回复