文章來(lái)源：sass安裝：webpack sass編譯失敗，node-sass安裝失敗的終極解決方
sass難言之隱-sass安裝的坑
之前花了很多時(shí)間折騰node-sass，發(fā)現(xiàn)sass老是安裝不上
從sass剛剛開(kāi)始出來(lái)開(kāi)始，就遇到ruby安裝sass失敗問(wèn)題。換淘寶gem庫(kù)
gem sources --remove https://rubygems.org/
gem sources -a?https://ruby.taobao.org/
gem install sass
后面又死node-sass 安裝失敗一系列問(wèn)題
《nodejs npm安裝本地node-sass失敗，ruby gem 安裝sass失敗總結(jié)》
總是在想，sass 為什么不用出一個(gè)純nodejs編譯器。
最先接觸的是less，可以直接引用js版編譯，在網(wǎng)頁(yè)直接運(yùn)營(yíng)，也有phpless，less在php中直接編譯，也可以在jsp中編譯。
sass用到現(xiàn)在，發(fā)現(xiàn)公司的網(wǎng)絡(luò)限制一個(gè)比一個(gè)狠。導(dǎo)致很難安裝。
依賴太多(ruby或者python2。你們是如何解決的——比如如何爭(zhēng)取權(quán)限
當(dāng)然，stylu也是替代方案，但是想sass，如果時(shí)間充裕，我都想弄哦編譯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
對(duì)于webpack ，在package移除node-sass 與 sass-loader
webpack.config 里面，對(duì) module.rules 中sass-loader ，替換為sassjs-loader
模板工程：
https://github.com/zhoulujun/webpack4-vue2-project-template
https://github.com/zhoulujun/wepack4-react-project-template
如果是vue-cli 創(chuàng)建的工程
因?yàn)関ue3.0后，vue-cli? 把webpack 封裝了n層，沒(méi)有經(jīng)歷去取研究
同理在工程目錄：npm i sass.js sassjs-loader??vue-cli-service-sassjs
同時(shí)移除@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"
? },
但是還是有一個(gè)坑：非：https://www.npmjs.com/package/sass
原來(lái)安裝的是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`
