通过npm 安装

cnpm install --save-dev sass-loader

cnpm install --save-dev node-sass

在build文件夹下的webpack.base.conf.js的rules里面添加配置

{

  test: /\.scss$/,

  loaders: ['style', 'css', 'sass']

}

上面那条配置可以省略，因为最新的vue-cli已经是默认配置好sass的（在build/util.js里），所以如果再在webpack里配置会重复，因此在main.js引入scss文件时会报错，也就是所只要安装了sass就行，什么都不用配置了

sass语法教程

vue项目 安装和配置sass & main.js引入scss文件报错的更多相关文章

  1. vue2.0 在main.js引入scss文件报错

    在vue2.0的main.js中引入scss文件报错 原因是在 在build文件夹下的webpack.base.conf.js的rules里面添加配置 { test: /\.scss$/, loade ...

  2. 踩坑，vue项目中，main.js引入scss文件时报错

    当我们在src目录下创建.scss文件,并在main.js中引用,运行时会报: ERROR Failed to compile with 1 errors 5:25:07 PMThis relativ ...

  3. vue引入css文件报错Unrecognised input

    一个vue项目中用到了swiper插件,引入swiper.css时报错 显示引入的css文件Unrecognised input ,在文件的line4,column12 . 其实是引入位置不对,样式文 ...

  4. vue项目过程的理解： main.js文件理解 router.js文件理解 以及组件 路由 等之间的关系

    https://blog.csdn.net/qq_26229005/article/details/85040393 内容太多了,有空再整理

  5. Vue项目中使用webpack配置了别名，引入的时候报错

    chainWebpack(config) { config.resolve.alias .set('@', resolve('src')) .set('assets', resolve('src/as ...

  6. Vue.js项目引入less文件报错解决

    解决方案: 需要局部安装vue-style-loader,less-loader,css-loader,vue-loader和less包(需注意就算全局安装以上包仍需局部安装) 即:npm i vue ...

  7. 【已解决】React中配置Sass引入.scss文件无效

    React中配置Sass引入.scss文件无效 在react中使用sass时,引入.scss文件失效 尝试很多方法没法解决,最终找到解决方法,希望能帮助正在坑里挣扎的筒子~ 在node_modules ...

  8. React中配置Sass引入.scss文件无效

    React中配置Sass引入.scss文件无效 在react中使用sass时,引入.scss文件失效尝试很多方法没法解决,最终找到解决方法,希望能帮助正在坑里挣扎的筒子~ 在node_modules文 ...

  9. 本地Vue项目跨域请求本地Node.js服务器的配置方法

    前言:跨域请求是在本地开发时经常遇到的需求,也很简单,只是几句代码配置一下的问题.我初次配置跨域请求时由于官方的说明太简洁,找到的教程又落伍,调试了一番并没有解决问题,到最后解决问题,已花费了很多时间 ...

随机推荐

  1. 用 Docker 搭建Sha--dow--sock--s 笔记

    首先得找一台海外服务器,该服务器一定要在海外. 一.在https://my.vultr.com/购买一台海外服务器,亲测选美国Miami速度最稳: 二.系统我选了CentOS 7 x64,在CentO ...

  2. Derby的安装与使用

    Derby数据库是一个纯用Java实现的内存数据库,属于Apache的一个开源项目.由于是用Java实现的,所以可以在任何平台上运行:另外一个特点是体积小,免安装,只需要几个小jar包就可以运行了. ...

  3. 转载：shell中#*,##*,#*,##*,% *,%% *的含义及用法

    介绍下Shell中的${}.##和%%使用范例,本文给出了不同情况下得到的结果.假设定义了一个变量为:代码如下:file=/dir1/dir2/dir3/my.file.txt可以用${ }分别替换得 ...

  4. CSS3 学习笔记（动画 多媒体查询）

    动画 1.@keyframes规则用于创建动画.在@keyframes中规定某项CSS样式,就能创建由当前样式逐渐改为新样式的动画效果 2.使用animation进行动画捆绑.两个值:动画名称.时长 ...

  5. /usr/lib/gcc/x86_64-linux-gnu/5/../../../x86_64-linux-gnu/crt1.o：在函数‘_start’中： (.text+0x20)：对‘main’未定义的引用

    原因是新建了一个可执行的函数,里面却没有main函数,加上main函数即可

  6. fastjson json转linkedhashmap为null

    试了几种JSONObject.parseObject的方法,返回的都是null: 使用Gson就可以转成功. LinkedHashMap<String, String> map = gso ...

  7. SpringBoot_02_SpringBoot的配置文件

    1.SpringBoot配置文件 SpringBoot是基于约定的,所以很多配置都有默认值,但如果想使用自己的配置替换默认配置的话,就可以使用application.properties或者appli ...

  8. ERROR in xxx.js from UglifyJs

    在打包项目的时候,出现如下的错误: 经过搜索找到原因: 这是因为webpack在打包vue文件时没有成功转换ES6的语法. 解决方案 解决方法很简单,加入babel-preset-es2015插件即可 ...

  9. 当EntityFramework爱上AutoMapper

    有时候相识即是一种缘分,相爱也不需要太多的理由,一个眼神足矣,当EntityFramework遇上AutoMapper,就是如此,恋爱虽易,相处不易. 在DDD(领域驱动设计)中,使用AutoMapp ...

  10. LintCode_1 单例模式

    从今天开始我的LintCode之旅,由于C/C++好久没有使用了,语法生疏不说,低级错误频繁出现,因此在做题之后,还会有部分时间复习语法项目. ---------------------------- ...