通过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. openSUSE 安装LAMP记录

    按照 openSUSE SDB:LAMP setup安装好了LAMP.运行的大多数命令都是来自与openSUSE SDB:LAMP setup中. 本页面描述如何安装LAMP,这是 Linux Apa ...

  2. arguments介绍(二)

    1.1 将参数从一个函数传递到另一个函数 下面是将参数从一个函数传递到另一个函数的推荐做法. function foo() { bar.apply(this, arguments); } functi ...

  3. css3中 百分比宽度减去固定宽度的写法

    div{ /*实现了宽度为父容器宽度减去固定的300像素*/ width:-webkit-calc(100% - 300px); width:-moz-calc(100% - 300px); widt ...

  4. XJOI夏令营501训练1——分配工作

    传送门:QAQQAQ 题意:某公司有工作人员x1,x2,…,xn ,他们去做工作y1,y2,…,ym(n<=m) ,每个人都能做其中的几项工作,并且对每一项工作都有一个固定的效率.问能否找到一种 ...

  5. WhaleCTF之web-本地登录

    WhaleCTF之web-本地登录 前往题目 呵呵,基然对ip限制,没事,掏出burp抓包 改包 添加XFF头部 X-Forwarded-For: 127.0.0.1 发一下 不是admin,没有用户 ...

  6. 安装office2019

    win10系统安装office2019 安装文件下载 https://pan.baidu.com/s/1VnqJ-hNwysPKBhdzE3FSww#list/path=%2F&parentP ...

  7. CAS客户端配置

    1. 导出证书 以上操作会在当前目录产生文件:ssodemo.crt(需要用到的文件请看CAS服务端配置那篇文章) 2. 客户端导入证书 以上操作会在jdk安装目录jre\lib\security下产 ...

  8. Python2.7安装matplotlib、numpy

    Windows版本 一.从官网下载python2.7,安装过程中把pip给装上,并且把path也选上,就是把自带的工具全选: 二.在cmd下输入python,会进入交互式界面,出了问题很大程度上是因为 ...

  9. Cmp- Linux必学的60个命令

    1.作用 cmp(“compare”的缩写)命令用来简要指出两个文件是否存在差异,它的使用权限是所有用户. 2.格式 cmp[options] 文件名 3.[options]主要参数 -l: 将字节以 ...

  10. [BZOJ2164]采矿【模拟+树链剖分+线段树】

    Online Judge:Bzoj2164 Label:模拟,树链剖分,线段树 题目描述 浩浩荡荡的cg大军发现了一座矿产资源极其丰富的城市,他们打算在这座城市实施新的采矿战略.这个城市可以看成一棵有 ...