• sass安装:webpack sass编译失败,node-sass安装失败的终极解决方


    文章来源:sass安装:webpack sass编译失败,node-sass安装失败的终极解决方

    sass难言之隐-sass安装的坑

    之前花了很多时间折腾node-sass,发现sass老是安装不上

    从sass刚刚开始出来开始,就遇到ruby安装sass失败问题。换淘宝gem库

    gem sources --remove https://rubygems.org/

    gem sources -a https://ruby.taobao.org/

    gem install sass

    后面又死node-sass 安装失败一系列问题

    nodejs npm安装本地node-sass失败,ruby gem 安装sass失败总结

    总是在想,sass 为什么不用出一个纯nodejs编译器。

    最先接触的是less,可以直接引用js版编译,在网页直接运营,也有phpless,less在php中直接编译,也可以在jsp中编译。

    sass用到现在,发现公司的网络限制一个比一个狠。导致很难安装。

    依赖太多(ruby或者python2。你们是如何解决的——比如如何争取权限

    当然,stylu也是替代方案,但是想sass,如果时间充裕,我都想弄哦编译sass的js的轮子。

    sass.js与sassjs-loader救民众于水火

    https://www.npmjs.com/package/sass.js

    https://www.npmjs.com/package/sassjs-loader

    npm i sass.js sassjs-loader

    对于webpack ,在package移除node-sass 与 sass-loader

    webpack.config 里面,对 module.rules 中sass-loader ,替换为sassjs-loader

    模板工程:

    https://github.com/zhoulujun/webpack4-vue2-project-template

    https://github.com/zhoulujun/wepack4-react-project-template

    如果是vue-cli 创建的工程

    因为vue3.0后,vue-cli  把webpack 封装了n层,没有经历去取研究

    同理在工程目录:npm i sass.js sassjs-loader  vue-cli-service-sassjs

    同时移除 @vue/cli-service

    不是sass 是sass.js

    或者把 @vue/cli-service 替换为我修改后的地址

    "devDependencies": {

        "@vue/cli-plugin-babel": "^3.8.0",

        "@vue/cli-plugin-eslint": "^3.8.0",

        "@vue/cli-service": "^3.8.0",

        "babel-eslint": "^10.0.1",

        "eslint": "^5.16.0",

        "eslint-plugin-vue": "^5.0.0",

        "vue-template-compiler": "^2.6.10"

      },

    替换为:

    "devDependencies": {

        "@vue/cli-plugin-babel": "^3.8.0",

        "@vue/cli-plugin-eslint": "^3.8.0",

        "@vue/cli-service": "git+https://github.com/zhoulujun/vue-cli-service-sassjs",

        "babel-eslint": "^10.0.1",

        "eslint": "^5.16.0",

        "eslint-plugin-vue": "^5.0.0",

        "vue-template-compiler": "^2.6.10"

      },

    但是还是有一个坑:非:https://www.npmjs.com/package/sass

    原来安装的是sass 而非sass.js

    Browserslist: caniuse-lite is outdated. Please run next command `npm update caniuse-lite browserslist`

    internal/modules/cjs/loader.js:638

        throw err;

        ^

    Error: Cannot find module 'sass.js'

        at Function.Module._resolveFilename (internal/modules/cjs/loader.js:636:15)

        at Function.Module._load (internal/modules/cjs/loader.js:562:25)

        at Module.require (internal/modules/cjs/loader.js:690:17)

        at require (internal/modules/cjs/helpers.js:25:18)

        at Object.

        at Module._compile (internal/modules/cjs/loader.js:776:30)

        at Object.Module._extensions..js (internal/modules/cjs/loader.js:787:10)

        at Module.load (internal/modules/cjs/loader.js:653:32)

        at tryModuleLoad (internal/modules/cjs/loader.js:593:12)

        at Function.Module._load (internal/modules/cjs/loader.js:585:3)

    Browserslist: caniuse-lite is outdated. Please run next command `npm update caniuse-lite browserslist`

  • 相关阅读:
    [NLP] 语义网络与知识图谱入门(二)
    [NLP] 语义网络与知识图谱入门(一)
    [论文理解] LFFD: A Light and Fast Face Detector for Edge Devices
    [学习笔记] 匈牙利匹配
    [NLP] nlp-lstm-cos -> sin
    [ros] ros入门记录
    [推荐系统] 两种协同过滤
    [NN] Guided Backpropgation 可视化
    [torch] pytorch hook学习
    python高级编程和算法
  • 原文地址:https://www.cnblogs.com/zhoulujun/p/11069302.html
Copyright © 2020-2023  润新知