任何scss文件更改时的node-sass错误

时间:2018-01-26 15:50:53

标签: css node.js git bash sass

我在使用node sass(以及任何其他sass软件)时非常困难,这只是给我错误而不是输出。要点:每次我运行 - 监视scss文件时,它都会返回一个我无法找到答案的错误。坦率地说,我不知道发生了什么,因为scss文件就像2-liner一样简单。 CSS

body
    margin: 0

package.json中的脚本部分如下所示:

"scripts": {
    "watch": "npm-run-all watch:* ",
    "watch:sass": "node-sass --output-style expanded --source-map true -o css sass --watch",
    "watch:autoprefixer": "onchange -d 100 css/style.css -- autoprefixer-cli -o css/style.prefixed.css css/style.css",
    "watch:browsersync": "browser-sync start --server --files css/*.css *.html",
    "build": "npm run build:clean && npm run build:sass && npm run build:autoprefixer && npm run test",
    "build:clean": "rimraf css/*.css",
    "build:sass": "node-sass --output-style compact -o css sass",
    "build:sass:dev": "node-sass --output-style expanded --source-map true -o css sass",
    "build:autoprefixer": "autoprefixer-cli css/style.css",
    "test": "npm-run-all test:*",
    "test:html": "globstar nu-html-checker *.html",
    "init-project": "npm-run-all init:*",
    "init:dirs": "mkdirp sass css vendor images js",
    "init:files": "touch README.md index.html sass/style.scss js/script.js",
    "init:gitignore": "curl https://raw.githubusercontent.com/github/gitignore/master/Node.gitignore -o .gitignore",
    "init:npm-install": "npm install"
  },

依赖关系:

"dependencies": {
    "autoprefixer": "^7.2.5",
    "autoprefixer-cli": "^1.0.0",
    "glob-run": "^0.1.6",
    "globstar": "^1.0.0",
    "node-sass": "^4.7.2",
    "npm-run-all": "^4.1.2",
    "nu-html-checker": "^0.1.0",
    "onchange": "^3.3.0",
    "parallelshell": "^3.0.2",
    "rimraf": "^2.6.2",
    "sass": "^1.0.0-beta.4",
    "sass-watch": "^0.1.0"
  }

来自node-sass的错误消息(我认为最短的命令):

$ npm run watch:sass

> 7.7@1.0.0 watch:sass E:\Kodilla\w07\Zadania\7.7
> node-sass -w sass/ -o css/output.css

=> changed: E:\Kodilla\w07\Zadania\7.7\sass\style.scss
=> changed: E:\Kodilla\w07\Zadania\7.7\sass\style.scss
{
  "status": 1,
  "file": "E:/Kodilla/w07/Zadania/7.7/sass/style.scss",
  "line": 1,
  "column": 1,
  "message": "Invalid CSS after \"h\": expected 1 selector or at-rule, was \"head\"",
  "formatted": "Error: Invalid CSS after \"h\": expected 1 selector or at-rule, was \"head\"\n        on line 1 of sass/style.scss\n>> head\n   ^\n"
}

$ npm run watch:sass

> 7.7@1.0.0 watch:sass E:\Kodilla\W07\Zadania\7.7
> node-sass --output-style expanded --source-map true -o css sass --watch

=> changed: E:\Kodilla\W07\Zadania\7.7\sass\style.scss
{
  "status": 1,
  "file": "E:/Kodilla/W07/Zadania/7.7/sass/style.scss",
  "line": 1,
  "column": 1,
  "message": "Invalid CSS after \"h\": expected 1 selector or at-rule, was \"head\"",
  "formatted": "Error: Invalid CSS after \"h\": expected 1 selector or at-rule, was \"head\"\n        on line 1 of sass/style.scss\n>> head\n   ^\n"
}

已安装的软件包(全部安装在本地):

 npm list --depth=0
7.7@1.0.0 E:\Kodilla\W07\Zadania\7.7
+-- autoprefixer@7.2.5
+-- autoprefixer-cli@1.0.0
+-- glob-run@0.1.6
+-- globstar@1.0.0
+-- node-sass@4.7.2
+-- npm-run-all@4.1.2
+-- nu-html-checker@0.1.0
+-- onchange@3.3.0
+-- parallelshell@3.0.2
+-- rimraf@2.6.2
+-- sass@1.0.0-beta.4
`-- sass-watch@0.1.0

$ npm list -g --depth=0
C:\Users\Radosław Podgórski\AppData\Roaming\npm
`-- (empty)

Cherry on top:当我运行npm run watch therer有3个错误块(从状态到格式化)具有相同的内容并且按下Ctrl + C git bash会话冻结 - 完全没有响应!手表被终止但会议在下一步被杀死。

当我尝试使用Koala v2.3.0时,问题可能更深,但它也不适用于scss文件(?)错误信息是(相同的2-liner或任何其他):

  

ArgumentError:UTF-8中的无效字节序列   使用--trace进行回溯

这个问题与所有scss文件有关(不仅仅是1)我还尝试了整个项目和其他项目的不同位置。考拉从未在我的电脑上工作过。也许两个问题完全无关。但是,可能有一个根本原因会影响我的PC上与scss / css相关的所有可能软件。

  

PC配置:

     
      
  • 操作系统名称:MS Windows 10 Pro
  •   
  • 版本:10.0.16299 Git
  •   
  • bash:git version 2.15.1.windows.2
  •   
  • node --version:v9.2.0
  •   

非常感谢任何帮助。谢谢!

1 个答案:

答案 0 :(得分:0)

编译.scss / .sass

文件扩展名必须与使用的语法相对应。 Sass编译器将根据扩展名解释文件的内容。

您正在使用带有.scss文件扩展名的缩进Sass语法;将文件扩展名更改为.sass以允许编译器正确解释您的文件。

使用带有SASS语法的.sass文件扩展名:

body
    margin: 0

使用带有SCSS语法的.scss文件扩展名:

body {
    margin: 0;
}

文件路径中的考拉和变音符号

考拉无法处理变音符号。