在使用scss是可能会添加loader,例如

  {
test: /\.scss$/,
use: ['style-loader', 'css-loader', 'sass-loader'],
}

然而当使用vue-cli脚手架创建项目时,可能出现如下错误:

Invalid CSS after "...load the styles": expected 1 selector or at-rule, was "var content = requi"
in G:......................\src\components\common\css\reset.scss (line 1, column 1)

这是loader重复导致的,在build/utils.js中的exports.cssLoaders中已经返回相关loader了,

  // 这两行:
sass: generateLoaders('sass', { indentedSyntax: true }),
scss: generateLoaders('sass'),

解决方案很简单:

就是自己不要加样式相关的loader了;
或者自己添加样式的loader但要注释掉这两行,当然如果你用的是less就注释掉对应的行就可以了。

vue的采坑之旅--vue-cli脚手架loader重复--Invalid CSS after "...load the styles": expected 1 selector or at-rule的更多相关文章

  1. webpack入坑之旅(二)loader入门

    这是一系列文章,此系列所有的练习都存在了我的github仓库中vue-webpack 在本人有了新的理解与认识之后,会对文章有不定时的更正与更新.下面是目前完成的列表: webpack入坑之旅(一)不 ...

  2. VUE 采坑之旅-- Mint-ui 按需引入报出Module build failed: Error: Couldn't find preset "es2015" relative to directory "C:\\phpStudy\\PHPTutorial\\WWW\\text\\vuep\\vue-demo"

    首先按照mint-ui的文档中按需引入的要求,先执行 npm install babel-plugin-component -D 然后,将.babelrc文件替换了,但是后来我又将其改了(采坑过程我也 ...

  3. vue+canvas踩坑之旅

    let img=new Image(); if(img.complete) { console.log('dd'); } img.src="http://localhost:8888/sta ...

  4. 从APP跳转到微信指定联系人聊天页面功能的实现与采坑之旅

    起因: 最近做的APP中有一个新功能:已知用户微信号,可点击直接跳转到当前用户微信聊天窗口页面. 当时第一想法是使用无障碍来做,并且觉得应该不难,只是逻辑有点复杂.没想到最终踩了好多坑,特地把踩过的坑 ...

  5. JSPDF支持中文(思源黑体)采坑之旅,JSPDF中文字体乱码解决方案

    我拍个砖,通常标称自己文章完美解决何种问题的,往往就是解决不了任何问题! 众所周知,JSPDF是一个开源的,易用的,但是对中文支持非常差的PDF库. 下面,我教大家,如何在pdf中使用思源黑体.思源黑 ...

  6. CentOS7.6系统安装详解(含真机装系统的采坑之旅)!

    刚开始学习linux操作系统是总是很茫然,无所适从,以下是自己总结的工作经验,仅供参考! 一.准备资源 安装前需要准备的资源有linux系统centos7.6发行版系统镜像,vmware workst ...

  7. angular5采坑之旅

    开始尝试angular5,在此记录下踩过的坑以备查询 1.按照element-angular的文档引入后报错 is not part of the compilation output.解决方法--在 ...

  8. Vue(项目踩坑)_解决vue中axios请求跨域的问题

    一.前言 今天在做项目的时候发现axios不能请求跨域接口 二.主要内容 1.之前直接用get方式请求聚合数据里的接口报错如下 2.当前请求的代码 3.解决方法 (1)在项目目录中依次找到:confi ...

  9. mac 如何卸载node和npm采坑之旅

    因为本地npm一直报错,所以决定直接卸载node和npm,重新装.第一次卸载,具体咱也不会呀!能咋整呢,百度呗 茫茫百度中各种找呀,找到一个转载最多的方法 sudo npm uninstall npm ...

随机推荐

  1. Linux 线程调度与优先级

    [转] http://blog.chinaunix.net/uid-20788636-id-1841334.html http://blog.chinaunix.net/uid-20788636-id ...

  2. Android微信支付SDK开发

    一.准备工作 1.开发平台及SDK下载 微信开放平台 https://open.weixin.qq.com 下载SDK 微信支付Demo下载 http://pay.weixin.qq.com/wiki ...

  3. svn取消文件夹关联的方法

    新建个记事本,贴入以下代码,保存后重命名后缀为reg,然后在目标文件夹右键就出现了删除SVN的选项了. 代码如下: Windows Registry Editor Version 5.00 [HKEY ...

  4. idea appliction context not configured for this file

    File --> Project Structure

  5. WWF3.5SP1 参考源码索引

    http://www.projky.com/dotnet/WF3.5SP1/System/Runtime/Serialization/FormatterServicesNoSerializableCh ...

  6. 网站源IP暴露使用高防之后还行不行如何解决?

    如题:使用高防后源站IP暴露的解决办法 在购买高防IP后,如果还存在攻击绕过高防直接打到源站IP的情况,就需要更换下源站IP了.但在这之前,请务必排查确认没有其他可能暴露源站IP的因素后,再去更换源站 ...

  7. es知识点

    版权声明:本文为博主原创文章,未经博主允许不得转载.转载请务必加上原作者:铭毅天下,原文地址:blog.csdn.net/laoyang360 https://blog.csdn.net/wojius ...

  8. TableView的cell加载倒计时重用问题解决方案

    TableView的cell加载倒计时重用问题解决方案 效果 说明 1. 写过类似需求的朋友一定知道,TableView上面加载倒计时功能会遇到复杂的重用问题难以解决 2. 本人提供一种解决思路,高效 ...

  9. Linux alias命令详解

    alias:内置命令(没有路径),设置命令的别名,保护系统,方便 unalias:别名取消 常用的命令展示 临时设置 alias cp='cp –i' unalias cp      取消系统的别命令 ...

  10. Linux FFmpeg(含x264、lame插件)安装记录

    What is FFmpeg? FFmpeg是一套可以用来记录.转换数字音频.视频,并能将其转化为流的开源计算机程序.它提供了录制.转换以及流化音视频的完整解决方案. What is x264? H. ...