uniapp-使用sassresourcesloader全局引入scss

49次阅读

共计 614 个字符,预计需要花费 2 分钟才能阅读完成。

1. 安装 sass-resources-loader 插件

npm i sass-resources-loader
项目地址:[http://npm.taobao.org/package/sass-resources-loader](http://npm.taobao.org/package/sass-resources-loader)

2.uni-app 项目根目录下手动创建一个 vue.config.js 配置文件

配置 vue.config.js 如下:

// vue.config.js
module.exports = {
    chainWebpack: config => {const oneOfsMap = config.module.rule('scss').oneOfs.store
        oneOfsMap.forEach(item => {
            item
                .use('sass-resources-loader')
                .loader('sass-resources-loader')
                .options({
                    // Provide path to the file with resources(这里是你.scss 文件所在路径)resources: './assets/css/*.scss',
                })
                .end()})
    }
}

3. 新建你需要全局引入的.scss 文件,如下:


4. 在需要用到全局样式的时候直接使用即可,如下:

5. 效果如下:

用同样的方式引入 less 文件,失败了,有知道问题所在的小伙伴可以留言,感激~

正文完
 0