添加 gulp-sass 由任务运行器中断
Adding gulp-sass breaks by task runner
我在 VS2017 中有一个基本的 gulp 设置来缩小我的 Javascript。我决定添加 gulp-sass(我的 package.json 说我在 gulp-sass v4.0.1)但是它抛出了这个错误:
C:\Work\MyProject\MyProject\node_modules\gulp-sass\index.js:66
let sassMap;
^^^
SyntaxError: Block-scoped declarations (let, const, function, class) not yet supported outside strict mode
at exports.runInThisContext (vm.js:53:16)
at Module._compile (module.js:373:25)
at Object.Module._extensions..js (module.js:404:10)
at Module.load (module.js:343:32)
at Function.Module._load (module.js:300:12)
at Module.require (module.js:353:17)
at require (internal/module.js:12:17)
at Object.<anonymous> (C:\Work\MyProject\MyProject\gulpfile.js:11:12)
at Module._compile (module.js:397:26)
at Object.Module._extensions..js (module.js:404:10)
我的 gulp 文件如下所示:
var gulp = require('gulp');
var concat = require('gulp-concat');
var rename = require('gulp-rename');
var watch = require('gulp-watch');
var uglify = require('gulp-uglify');
var sass = require('gulp-sass');
gulp.task('minify', function () {
gulp.src('src/**/*.js')
.pipe(uglify({ mangle: false }))
.pipe(concat('scripts.min.js'))
.pipe(gulp.dest('Content'));
});
gulp.task('sass', function () {
gulp.src('src/css/**/*.scss')
.pipe(sass({ outputStyle: 'compressed' }))
.pipe(gulp.dest('Content'));
});
gulp.task('watch', function () {
gulp.watch('src/**/*.js', ['minify']);
});
我做了一些谷歌搜索,建议的一个简单修复是将 "use strict" 添加到有问题的文件的顶部,在本例中为 index.js:66。但是,这样做之后我得到:
Failed to run "C:\Work\MyProject\MyProject\Gulpfile.js"...
cmd.exe /c gulp --tasks-simple
C:\Work\MyProject\MyProject\node_modules\node-sass\lib\binding.js:15
throw new Error(errors.missingBinary());
^
Error: Missing binding C:\Work\MyProject\MyProject\node_modules\node-sass\vendor\win32-x64-47\binding.node
Node Sass could not find a binding for your current environment: Windows 64-bit with Node.js 5.x
Found bindings for the following environments:
- Windows 64-bit with Node.js 6.x
This usually happens because your environment has changed since running `npm install`.
Run `npm rebuild node-sass --force` to build the binding for your current environment.
at module.exports (C:\Work\MyProject\MyProject\node_modules\node-sass\lib\binding.js:15:13)
at Object.<anonymous> (C:\Work\MyProject\MyProject\node_modules\node-sass\lib\index.js:14:35)
at Module._compile (module.js:397:26)
at Object.Module._extensions..js (module.js:404:10)
at Module.load (module.js:343:32)
at Function.Module._load (module.js:300:12)
at Module.require (module.js:353:17)
at require (internal/module.js:12:17)
at Object.<anonymous> (C:\Work\MyProject\MyProject\node_modules\gulp-sass\index.js:163:21)
at Module._compile (module.js:397:26)
我是运行Node.jsv6。我不知道为什么应该是一个简单的过程却给我这些错误。我做错了什么?
更新:
我运行评论中建议的命令如下:
npm install node-sass -f
npm rebuild nose-sass
两者都运行成功。但是,我仍然收到此错误:
Failed to run "C:\Work\MyProject\MyProject\Gulpfile.js"...
cmd.exe /c gulp --tasks-simple
C:\Work\MyProject\MyProject\node_modules\gulp-sass\index.js:66
let sassMap;
^^^
SyntaxError: Block-scoped declarations (let, const, function, class) not yet supported outside strict mode
at exports.runInThisContext (vm.js:53:16)
at Module._compile (module.js:373:25)
at Object.Module._extensions..js (module.js:404:10)
at Module.load (module.js:343:32)
at Function.Module._load (module.js:300:12)
at Module.require (module.js:353:17)
at require (internal/module.js:12:17)
at Object.<anonymous> (C:\Work\MyProject\MyProject\gulpfile.js:8:12)
at Module._compile (module.js:397:26)
at Object.Module._extensions..js (module.js:404:10)
更新二:
有人建议我添加 "use strict";到我的gulpfile.js的顶部,但出现同样的错误。这是文件内容:
"use strict";
var gulp = require('gulp');
var sass = require('gulp-sass'); // If I comment this out, I can build
gulp.task('sass', function () {
gulp.src('src/css/**/*.scss')
.pipe(sass({ outputStyle: 'compressed' }))
.pipe(gulp.dest('Content'));
});
网上最常见的问题似乎是 Node.js 版本 < 6.0,但我是 运行 v6.11.1。
更新 3:(已解决)
我终于找到了原因和解决方法;我已将其添加为下面的任何未来读者的答案。享受。
设法找到了问题,所以我正在为未来的读者回答我自己的问题。
虽然我安装了 node.js v6.11.1,但 Visual Studio 2017 捆绑了默认使用的自己的节点版本。即使你在 VS2017 shell 中 运行 node -v
并且它告诉你它是 运行ning v6.11.1,它实际上 - 默认情况下 - 运行ning 无论它在 .\node_mobules\.bin
.
中找到
解决方法是这样的:
在VS2017中,进入"Tools > Options > Projects and Solutions > Web Package Management > External Web Tools"。
你可能会看到这个:
- 将路径添加到 node 的独立安装(默认
C:\Program Files\nodejs
),然后使用箭头将其定位在 .\node_modules\bin
版本之上,如下所示:
- 点击确定并刷新任务运行器资源管理器或重新启动 VS2017。你的 gulpfile 现在应该构建了。
在我的例子中,我必须将 $(PATH) 移动到 $(VSINSTALLDIR)/Web/External 之上才能解决问题。
我在 VS2017 中有一个基本的 gulp 设置来缩小我的 Javascript。我决定添加 gulp-sass(我的 package.json 说我在 gulp-sass v4.0.1)但是它抛出了这个错误:
C:\Work\MyProject\MyProject\node_modules\gulp-sass\index.js:66
let sassMap;
^^^
SyntaxError: Block-scoped declarations (let, const, function, class) not yet supported outside strict mode
at exports.runInThisContext (vm.js:53:16)
at Module._compile (module.js:373:25)
at Object.Module._extensions..js (module.js:404:10)
at Module.load (module.js:343:32)
at Function.Module._load (module.js:300:12)
at Module.require (module.js:353:17)
at require (internal/module.js:12:17)
at Object.<anonymous> (C:\Work\MyProject\MyProject\gulpfile.js:11:12)
at Module._compile (module.js:397:26)
at Object.Module._extensions..js (module.js:404:10)
我的 gulp 文件如下所示:
var gulp = require('gulp');
var concat = require('gulp-concat');
var rename = require('gulp-rename');
var watch = require('gulp-watch');
var uglify = require('gulp-uglify');
var sass = require('gulp-sass');
gulp.task('minify', function () {
gulp.src('src/**/*.js')
.pipe(uglify({ mangle: false }))
.pipe(concat('scripts.min.js'))
.pipe(gulp.dest('Content'));
});
gulp.task('sass', function () {
gulp.src('src/css/**/*.scss')
.pipe(sass({ outputStyle: 'compressed' }))
.pipe(gulp.dest('Content'));
});
gulp.task('watch', function () {
gulp.watch('src/**/*.js', ['minify']);
});
我做了一些谷歌搜索,建议的一个简单修复是将 "use strict" 添加到有问题的文件的顶部,在本例中为 index.js:66。但是,这样做之后我得到:
Failed to run "C:\Work\MyProject\MyProject\Gulpfile.js"...
cmd.exe /c gulp --tasks-simple
C:\Work\MyProject\MyProject\node_modules\node-sass\lib\binding.js:15
throw new Error(errors.missingBinary());
^
Error: Missing binding C:\Work\MyProject\MyProject\node_modules\node-sass\vendor\win32-x64-47\binding.node
Node Sass could not find a binding for your current environment: Windows 64-bit with Node.js 5.x
Found bindings for the following environments:
- Windows 64-bit with Node.js 6.x
This usually happens because your environment has changed since running `npm install`.
Run `npm rebuild node-sass --force` to build the binding for your current environment.
at module.exports (C:\Work\MyProject\MyProject\node_modules\node-sass\lib\binding.js:15:13)
at Object.<anonymous> (C:\Work\MyProject\MyProject\node_modules\node-sass\lib\index.js:14:35)
at Module._compile (module.js:397:26)
at Object.Module._extensions..js (module.js:404:10)
at Module.load (module.js:343:32)
at Function.Module._load (module.js:300:12)
at Module.require (module.js:353:17)
at require (internal/module.js:12:17)
at Object.<anonymous> (C:\Work\MyProject\MyProject\node_modules\gulp-sass\index.js:163:21)
at Module._compile (module.js:397:26)
我是运行Node.jsv6。我不知道为什么应该是一个简单的过程却给我这些错误。我做错了什么?
更新:
我运行评论中建议的命令如下:
npm install node-sass -f
npm rebuild nose-sass
两者都运行成功。但是,我仍然收到此错误:
Failed to run "C:\Work\MyProject\MyProject\Gulpfile.js"...
cmd.exe /c gulp --tasks-simple
C:\Work\MyProject\MyProject\node_modules\gulp-sass\index.js:66
let sassMap;
^^^
SyntaxError: Block-scoped declarations (let, const, function, class) not yet supported outside strict mode
at exports.runInThisContext (vm.js:53:16)
at Module._compile (module.js:373:25)
at Object.Module._extensions..js (module.js:404:10)
at Module.load (module.js:343:32)
at Function.Module._load (module.js:300:12)
at Module.require (module.js:353:17)
at require (internal/module.js:12:17)
at Object.<anonymous> (C:\Work\MyProject\MyProject\gulpfile.js:8:12)
at Module._compile (module.js:397:26)
at Object.Module._extensions..js (module.js:404:10)
更新二:
有人建议我添加 "use strict";到我的gulpfile.js的顶部,但出现同样的错误。这是文件内容:
"use strict";
var gulp = require('gulp');
var sass = require('gulp-sass'); // If I comment this out, I can build
gulp.task('sass', function () {
gulp.src('src/css/**/*.scss')
.pipe(sass({ outputStyle: 'compressed' }))
.pipe(gulp.dest('Content'));
});
网上最常见的问题似乎是 Node.js 版本 < 6.0,但我是 运行 v6.11.1。
更新 3:(已解决)
我终于找到了原因和解决方法;我已将其添加为下面的任何未来读者的答案。享受。
设法找到了问题,所以我正在为未来的读者回答我自己的问题。
虽然我安装了 node.js v6.11.1,但 Visual Studio 2017 捆绑了默认使用的自己的节点版本。即使你在 VS2017 shell 中 运行 node -v
并且它告诉你它是 运行ning v6.11.1,它实际上 - 默认情况下 - 运行ning 无论它在 .\node_mobules\.bin
.
解决方法是这样的:
在VS2017中,进入"Tools > Options > Projects and Solutions > Web Package Management > External Web Tools"。
你可能会看到这个:
- 将路径添加到 node 的独立安装(默认
C:\Program Files\nodejs
),然后使用箭头将其定位在.\node_modules\bin
版本之上,如下所示:
- 点击确定并刷新任务运行器资源管理器或重新启动 VS2017。你的 gulpfile 现在应该构建了。
在我的例子中,我必须将 $(PATH) 移动到 $(VSINSTALLDIR)/Web/External 之上才能解决问题。