我弄的每次修改 js 或 html 文件，瀏覽器都會重新整理頁面。而不會重新加載。這一點都不像網路上說的
以下是我的程式碼:
browserSync = require('browser-sync').create(),
var htmlSrc = ['app/**/*.html', '!app/index.html', '!app/lib/**/*.html', '!app/lib/*.html'];
var jsSrc = ['app/**/*.js', '!app/lib/**/*.js', '!app/assets/**/*.js'];
var cssSrc = ['app/assets/**/*.css', '!app/lib/**/*.css'];
var imgSrc = ['app/assets/img/*', 'app/assets/img/**/*'];
var fontSrc = ['app/assets/fonts/**/*'];
var jsonSrc = ['app/translate/*.json', 'app/translate/**/*.json'];
var libSrc = ['app/lib/**/*'];
var indexSrc = 'app/index.html';
var buildPath = 'dist/';
var debugPath = 'app/';
gulp.task('createIndex', function() {
return gulp.src(indexSrc)
.pipe(replace(/\.js/g, '.min.js'))
.pipe(htmlmin({collapseWhitespace: true}))
.pipe(gulp.dest(buildPath))
.pipe(browserSync.stream());
});
gulp.task('compressHTML', function() {
return gulp.src(htmlSrc)
.pipe(htmlmin({collapseWhitespace: true}))
.pipe(gulp.dest(buildPath))
.pipe(browserSync.stream());
});
gulp.task('compressJS', function() {
var filterIndex = filter(['**/app.config.js', '**/app.module.js', '**/app.route.oclazy.js'], {restore: true});
return gulp.src(jsSrc)
.on('error', function(err) {//语法检查，打印错误
console.log('Error: ', err.message);
})
.pipe(filterIndex)
.pipe(rename({suffix: '.min'}))
.pipe(filterIndex.restore)
.pipe(uglify())//压缩
.pipe(gulp.dest(buildPath))
.pipe(browserSync.stream());
});
gulp.task('compressCSS', function() {
return gulp.src(cssSrc)
//.pipe(concat('index.min.css')) 为了使用 oclazyload 不整合
.pipe(minifycss())
.pipe(gulp.dest(buildPath + 'assets'))
.pipe(browserSync.stream());
});
gulp.task('compressJSON', function () {
return gulp.src(jsonSrc)
.pipe(jsonminify())
.pipe(gulp.dest(buildPath + 'translate'))
.pipe(browserSync.stream());
});
gulp.task('copyImg', function() {
return gulp.src(imgSrc)
.pipe(gulp.dest(buildPath + 'assets/img'))
.pipe(browserSync.stream());
});
gulp.task('copyLib', function() {
return gulp.src(libSrc)
.pipe(gulp.dest(buildPath + 'lib'))
.pipe(browserSync.stream());
});
gulp.task('copyFont', function() {
return gulp.src(fontSrc)
.pipe(gulp.dest(buildPath + 'assets/fonts'))
.pipe(browserSync.stream());
});
gulp.task('clean', function() {
return gulp.src(buildPath)
.pipe(clean());
});
gulp.task('startCreate', ['clean'], function() {
runSequence('createIndex',
['compressHTML', 'compressJS', 'compressCSS', 'compressJSON'],
['copyLib', 'copyImg', 'copyFont']);
});
gulp.task('browserSync', function() {
gulp.start('startCreate');
browserSync.init({
server: {
baseDir: buildPath
}
});
gulp.watch(indexSrc, ['createIndex']);
gulp.watch(htmlSrc, ['compressHTML']);
gulp.watch(jsSrc, ['compressJS']);
gulp.watch(cssSrc, ['compressCSS']);
gulp.watch(jsonSrc, ['compressJSON']);
});
gulp.task('default', ['browserSync']);
新的回答： // 評論區放不下
非常抱歉我沒見過你這種寫法，這是我對
ionic 1.0版本進行的增強做法，你可以參考:沒看過這種用法，你看官方文件的用法 http://www.browsersync.cn/doc...
還有沒監聽server？
然後少了change就reload？
gulp.watch("*.html").on("change", browserSync.reload);
@鴻則 @小_u_醬 很感謝你的回复，我就如下修改（讓人失望的是依舊沒效果，每次修改js文件，瀏覽器依舊會刷新頁面）
另外我的gulp版本是3.9.1