踩坑,vue项目中,main.js引入scss文件时报错
当我们在src目录下创建.scss文件,并在main.js中引用,运行时会报:
ERROR Failed to compile with 1 errors 5:25:07 PM
This relative module was not found:
* ./main.scss in ./src/main.js
如图所示

解决方法:
新版本的vue-cli已经帮我们把sass-loader配置好了,放在util.js里面了
前面我们通过 cnpm i node-sass sass-loader -D 安装好了scss依赖
并在build文件夹下的webpack.base.conf.js的rules里面添加了如下配置
{
现在不需要这样配置。如果这样配置会报错,因为配置重复了。
只需将此配置删除即可
踩坑,vue项目中,main.js引入scss文件时报错的更多相关文章
- vue项目 安装和配置sass & main.js引入scss文件报错
通过npm 安装 cnpm install --save-dev sass-loader cnpm install --save-dev node-sass 在build文件夹下的webpack.ba ...
- vue2.0 在main.js引入scss文件报错
在vue2.0的main.js中引入scss文件报错 原因是在 在build文件夹下的webpack.base.conf.js的rules里面添加配置 { test: /\.scss$/, loade ...
- vue项目中设置全局引入scss,使每个组件都可以使用变量
在Vue项目中使用scss,如果写了一套完整的有变量的scss文件.那么就需要全局引入,这样在每个组件中使用. 可以在mian.js全局引入,下面是使用方法. 1: 安装node-sass.sass- ...
- 【已解决】React中配置Sass引入.scss文件无效
React中配置Sass引入.scss文件无效 在react中使用sass时,引入.scss文件失效 尝试很多方法没法解决,最终找到解决方法,希望能帮助正在坑里挣扎的筒子~ 在node_modules ...
- React中配置Sass引入.scss文件无效
React中配置Sass引入.scss文件无效 在react中使用sass时,引入.scss文件失效尝试很多方法没法解决,最终找到解决方法,希望能帮助正在坑里挣扎的筒子~ 在node_modules文 ...
- 在vue项目中正确的引入jquery和bootstrap
<script>标签引入jquery在vue脚手架里并不适用,需要利用webpack引入jquery 一.第一种方法 1:因为已经安装了vue脚手架,所以需要在webpack中全局引入jq ...
- 在vue项目中的js文件里使用vue实例
参考的网址:https://blog.csdn.net/weixin_34353714/article/details/86958742 不为其他,就为了记录一下,方便以后查看: 第一种方法: 1.首 ...
- 在vue项目中正确的引入jquery
最近学习vue,习惯性的通过<script>标签引入jquery,写完后报错才想起来,这种方式在vue是不适用的. 1:因为已经安装了vue脚手架,所以需要在webpack中全局引入jqu ...
- Vue项目中jQuery的引入
1.安装jQuery依赖 npm install jquery --save-dev 2.在webpack.base.conf.js头部加入如下代码 var webpack = require(&qu ...
随机推荐
- HDU-6038 Function 思维+循环节
解法:这道题很有意思,值得一做和细细思考. 首先是我们要观察这个映射公式,他的实质是什么?其实就是b到a的循环映射,这是因为a数列和b数列都是0-n-1的排列,意味着每个数都是唯一的,那么ab的这个循 ...
- QTextStream写文件中文乱码解决办法
1.首先把Qt Creator的编辑器设置为使用 UTF-8: 工具-->选项-->文本编辑器-->行为,在右侧选项界面找到文件编码选项,设置为 UTF-8.2.使用 QText ...
- vue2.0 通信
一.父子组件通信 父组件通过 props 向下传递数据给子组件,子组件通过 events 给父组件发送消息 具体机制如下图: 1.父组件传递数据给子组件 ( parent ==> child ...
- BZOJ 1233 干草堆 (单调队列优化DP)
$ BZOJ~1233~~ $ 干草堆: (题目特殊性质) $ solution: $ 很妙的一道题目,开始看了一眼觉得是个傻逼贪心,从后往前当前层能多短就多短,尽量节省花费.但是这是DP专题,怎么会 ...
- 【java】Split函数踩坑记
先看一段代码: String line = "openssh|7.1"; String[] pkg = line.split("|"); System.out. ...
- 对provide/inject的研究
1.组件中通过provider来提供变量,然后在子组件中通过inject来注入变量. 2.在父组件中定义: provide () { return { secondPageTableRoot: { t ...
- Python全栈开发,Day3
一.基本数据类型 基础数据类型,有7种类型,存在即合理. 1.int 整数 主要是做运算的.比如加减乘除,幂,取余 + - * / ** % ... 2.bool 布尔值 判断真假以及作为条件变量 ...
- 20180803-Java 流(Stream)、文件(File)和IO
Java 流(Stream).文件(File)和IO 下面的程序示范了用read()方法从控制台不断读取字符直到用户输入"q". // 使用BufferedReader 在控制台读 ...
- [CF1056E]Check Transcription
题目:Check Transcription 传送门:http://codeforces.com/contest/1056/problem/E 分析: 1)显然有个$O( \frac{t}{max(c ...
- vue子组件获取父组件的数据