app开发定制vue3.0安装sass（scss）以及报错解决

app开发定制本篇文章主要记录了笔app开发定制者安装的过程

1.安装

首先在官网中下载
https://rubyinstaller.org/downloads/

下载之后进行安装
在安装过程中，要记得勾选添加环境变量的选项，其他的就是一直next就可以了
安装完成之后可以在终端输入ruby -v 查看是否安装成功

2.安装sass（scss）

之后cd到项目的目录下
进行sass的安装

npm install sass-loader@7.3.1 --save-dev
npm install -sass --save-dev
npm install style-loader --save-dev

上面指定版本号的原因是为了防止版本号过高出现报错

3.解决安装完成还是无法使用的问题

安装之后重新运行项目还是报错

解决方法：
在webpack.config.js文件中写入以下代码：

module.export = {    module: {        rules: [            {                test: /\.scss$/,                loaders: ['style', 'css', 'sass']            }        ]    }}
1
2
3
4
5
6
7
8
9
10
11

因为是使用vue-cli创建的项目，在目录中并没有webpack.config.js文件，因此
在根目录下，创建webpack.config.js
再在其中写入
如图：

之后重新运行项目，问题解决