Gulp Script [Gulp Watch] - 无法找到模块'浏览器同步'

时间:2017-12-25 18:32:00

标签: javascript node.js gulp browser-sync gulp-watch

所以我知道此错误的其他实例,但无论我尝试了哪种方式,我都会继续收到此错误

 throw err;
^

Error: Cannot find module 'browser-sync'
    at Function.Module._resolveFilename (module.js:470:15)
    at Function.Module._load (module.js:418:25)
    at Module.require (module.js:498:17)
    at require (internal/module.js:20:19)
    at Object.<anonymous> (C:\Users\shiha\Desktop\coding\html\myWebsite\gulpfile.js:3:19)
    at Module._compile (module.js:571:32)
    at Object.Module._extensions..js (module.js:580:10)
    at Module.load (module.js:488:32)
    at tryModuleLoad (module.js:447:12)
    at Function.Module._load (module.js:439:3)

我尝试清理缓存并调用npm install 以及npm i broswer-sync --save。没有什么变化。

这是我的gulp脚本的副本,但我不相信我做错了。

var gulp = require('gulp');
var sass = require('gulp-sass');
var browserSync = require('browser-sync');

gulp.task('browserSync', function() {
  browserSync.init({
    server: {
      baseDir: 'app'
    },
  })
})

gulp.task('sass', function() {
  return gulp.src('app/scss/**/*.scss')
    .pipe(sass())
    .pipe(gulp.dest('app/css'))
    .pipe(browserSync.reload({
      stream: true
    }))
});

gulp.task('watch', ['browserSync', 'sass'], function (){
  gulp.watch('app/scss/**/*.scss', ['sass']);
  // Reloads the browser whenever HTML or JS files change
  gulp.watch('app/*.html', browserSync.reload);
  gulp.watch('app/js/**/*.js', browserSync.reload);
});

我在Windows机器上 npm -v = 5.6 node -v = 7.4

在此先感谢我刚刚卡住了。 另外这里是我的json的副本,因为起初我以为我错过了包,但我已经安装了它。当我回忆起npm install时,我得到的是#34;最新的#34;

  "devDependencies": {
   "browser-sync": "^2.21.0",
    "gulp": "^3.9.1",
    "gulp-sass": "^3.1.0"
  }
}

2 个答案:

答案 0 :(得分:1)

似乎缺少包,只需要进行npm安装。

<强> npm install browser-sync --save

答案 1 :(得分:0)

我无法完全确认这是一个Windows问题,但我发现解决此问题的一种迂回方式是使用Windows bash终端而不是cmd或PowerShell。这样做只需致电

npm install

现在应该安装所有必需的软件包,但是对于Linux环境。现在,如果你在cmd中调用你的gulp脚本它就不会工作,但是如果你在windows bash终端中这样做,它就会。