前端（9）vue安装sass

一、创建vue项目

vue init webpack app-name

二、安装sass

cnpm install -D node-sass sass-loader

三、node-sass版本和sass-loader版本对应

node	node-sass	sass-loader
16	6.0.1	10.2.0

npm i [email protected] [email protected] --save-dev
# 如果报错，可能是安装过程中某些包丢失，尝试以下方法解决
npm rebuild node-sass

查看node和node-sass对应版本

遇到的问题

1. Module build failed: TypeError: this.getOptions is not a function
   这是由于安装的版本过高导致的，安装低版本的即可
   目前我本地的node版本是16.10.0，那么node-sass可以安装6.0.0版本的。如果是14.10.0版本的，可以安装4.14.1版本

cnpm install -D [email protected] [email protected]

2. 下载镜像失败

Downloading binary from https://cdn.npmmirror.com/binaries/node-sass/v4.14.1/win32-x64-93_binding.node
Cannot download "https://cdn.npmmirror.com/binaries/node-sass/v4.14.1/win32-x64-93_binding.node": 

HTTP error 404 Not Found

Hint: If github.com is not accessible in your location
      try setting a proxy via HTTP_PROXY, e.g.

      export HTTP_PROXY=http://example.com:1234

or configure npm proxy via

      npm config set proxy http://example.com:8080

解决办法：
将镜像先下载下来，下载对应版本的对应文件，下载地址如下
https://github.com/sass/node-sass/tags
然后进行安装

# 配置路径
set SASS_BINARY_PATH=d:\win32-x64-72_binding.node
# 安装
npm i node-sass -D –verbose

3. 这是我遇到的最头疼的一个问题，网上查的所有的办法都试过了还，还是各种报错，错误太多了，如下所示：

1. Error: Node Sass version 6.0.1 is incompatible with ^4.0.0.
2. Error: Node Sass version 7.0.1 is incompatible with ^4.0.0.
3. # SEO
Syntax Error: Error: Node Sass does not yet support your current environment: Windows 64-bit with Unsupported runtime (93)
For more information on which environments are supported please see:
https://github.com/sass/node-sass/releases/tag/v4.14.1

试了无数遍，最后是安装了[email protected]、[email protected]才解决的，安装之前一定要把之前安装的卸载干净才可以

npm uninstall --save sass-loader
npm uninstall --save node-sass 
cnpm install --D [email protected]
cnpm install --save [email protected]

每次解决这个问题都需要2两天时间，每次都能各种装不成功。我再也不想遇见这个问题了