程序员

为 wxa.js 构建的小程序移除 scss 依赖

作者:admin 2021-05-07 我要评论

wxa.js 默认使用的样式语言是 scss,所以其默认创建的项目就会要求安装 node-sass,但由于 node-sass 依赖了 binding.node 等包,导致常常会出现 node-sass 安装...

在说正事之前,我要推荐一个福利:你还在原价购买阿里云、腾讯云、华为云服务器吗?那太亏啦!来这里,新购、升级、续费都打折,能够为您省60%的钱呢!2核4G企业级云服务器低至69元/年,点击进去看看吧>>>)

wxa.js 默认使用的样式语言是 scss,所以其默认创建的项目就会要求安装 node-sass,但由于 node-sass 依赖了 binding.node 等包,导致常常会出现 node-sass 安装失败的问题。

如果你并没有在项目中使用 scss ,则可以考虑将你项目种的 node-sass 移除,从而缩小项目的依赖体积,提升项目安装成功的概率。

思路

由于 wxa 默认使用了 scss,因此,我们需要移除项目中针对 scss 的配置,并移除代码中的 scss ,这样才能保证后续在编译的过程中,不会调用 node-sass 的依赖。

步骤

  1. 移除 wxa.config.js 中关于 scss 的配置

在 wxa 的默认配置中,配置了 sass/scss 的依赖,我们如果不移除这个依赖,就会导致后续在构建的时候,自动安装相关依赖。

因此,我们需要在 wxa.config.js 中添加 use 相关配置,且仅保留 babel 作为依赖,具体修改如下:

module.exports = {
    plugins: [
        new ReplacePlugin({
            list: envlist,
        }),
    ],
    // 你的其他配置
    use: [
        {
            test: /\.js$/,
            name: 'babel',
        },
    ],
    // 你的其他配置
};
  1. 移除项目中标记为 Scss 的语言

在移除了 wxa.js 的构建依赖后,接下来需要移除代码中关于 scss 的标示,从而使我们的代码可以被正确的渲染工具所渲染。具体修改如下所示,右侧为修改后的结果

  1. 移除 package.json 中的 相关依赖。

当我们完成了上述的操作之后,就可以放心的移除系统中关于 sass 的依赖了,从而减少整个项目的体积和对 node-sass 的依赖。

你只需要执行如下的命令,就可以移除项目中关于 sass 的依赖了。

npm uninstall @wxa/compiler-sass
// 或者
yarn remove @wxa/compiler-sass

总结

scss是一个好的语言,但 node-sass 却不是一个好的工具,如果你不使用它,不妨将其移除,提升你的项目构建速度。


本文转自网络,版权归原作者所有,原文链接:https://segmentfault.com/a/1190000039954229

版权声明:本文转载自网络,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。本站转载出于传播更多优秀技术知识之目的,如有侵权请联系QQ/微信:153890879删除

相关文章
  • 【20210405】读研规划(更新ing)

    【20210405】读研规划(更新ing)

  • 操作系统学习笔记----内存管理

    操作系统学习笔记----内存管理

  • Mallet算法及滤波器

    Mallet算法及滤波器

  • 剑指offer24:链表的反转

    剑指offer24:链表的反转

腾讯云代理商
海外云服务器