Javascript 设置BrowserSync和Ripple Emulator

我目前正在使用Cordova平台开发hybird应用程序，并使用Ripple Emulator进行调试

应用程序本身并不真正依赖于目标平台的本机API，因此我可以使用Ripple emulator提供的一些模拟功能对其进行测试，而不用担心。每次我对源文件进行更改时，我的gulp任务都会编译javascript（我使用的是带babel的ES6），并使用browserify自动打包

但是，我需要重新加载浏览器选项卡，以便看到更改，更不用说如果重新加载选项卡，ripple将重新加载其模块和引擎

由于效率低下，我尝试创建一个自动重新加载（将更改注入）浏览器的“吞咽”任务。我使用以下设置：

gulp.task('cordova-prepare', function() {
    exec('cordova prepare');
});

gulp.task('reload', function() {
    browserSync.reload();
});

gulp.task('script', function() {
    var bundler = browserify("./src/Main.js");
    bundler.transform("babelify", {presets: ["es2015"]});

    bundler.bundle()
        .on('error', function(err) { gutil.log(err); })
        .pipe(source('app.js'))
        .pipe(gulp.dest('./www/scripts'))
        .pipe(browserSync.stream());
});


gulp.task('watch', function() {
    gulp.watch('./src/**/*.js', ['script']);

    gulp.watch('./www/**/*.html', ['cordova-prepare', 'reload']);
    gulp.watch('./www/**/*.css', ['cordova-prepare', 'reload']);
    gulp.watch('./www/**/*.js', ['cordova-prepare']);
});

gulp.task('watch-source', ['script'], function() {
    gulp.watch('./src/**/*.js', ['script']);
});

gulp.task('ripple', ['script', 'watch'], function() {
    var options = {
        keepAlive: false,
        open: true,
        port: 4400
    };

    browserSync.init({
        proxy: "http://localhost:" + options.port + "/?enableripple=cordova-3.0.0"
    });

    ripple.emulate.start(options);
});

主要问题是，每当我对javascript文件进行更改时，它都会重新加载选项卡，而不是注入更改。我也不太清楚cordova准备了什么命令，但似乎有必要在

platform

文件夹中为当前平台创建web应用程序

请注意，我在

script

任务中使用

stream（）

，以便注入javascript，但它不起作用

我所期望的是，当我更改一些文件时，它会将新文件注入浏览器选项卡（包括html和css）

---

有什么想法吗？

但它没有提到何时进行注入以及何时进行完全重新加载，我能做些什么来强制它注入更改吗？CSS&Image->injection，everything->reload但它没有提到何时进行注入以及何时进行完全重新加载，我能做些什么来强制它注入更改吗？CSS&图像->注入，其他一切->重新加载