如何避免GULP打开新标签?

时间:2015-02-18 17:07:36

标签: javascript ionic-framework gulp

这是我的问题,每次我进入控制台并尝试通过gulp重新启动服务器时,浏览器中都会打开一个新选项卡,所以我必须关闭我的那个打开并开始研究新的。

关于同样的另一个问题:

有时候代码样式会出现错误,一旦你执行gulp标签就会打开,但是在你修改代码样式的错误之前你就无法开始处理它,然后你就去做了gulp并出现新标签。

这是我的gulpfile.js

var gulp = require('gulp');

var paths = {
  sass: ['scss/**/*.scss'],
  js: ['www/js/*.js', 'www/js/**/*.js', '!www/js/lib.min.js', '!www/js/code.min.js']
};

// Dev task
gulp.task('dev', ['sass', 'lint', 'compress-lib', 'compress-js', 'run-ionic'], function() { });

// Build task
gulp.task('default', ['dev', 'lint', 'sass', 'compress-lib', 'compress-js', 'watch']);

//Ionic Serve Task
gulp.task('run-ionic',shell.task([
  'ionic serve'
]));

gulp.task('compress-lib', function() {
  gulp.src([
    './www/lib/ionic/js/ionic.bundle.min.js'
  ])
    .pipe(concat('lib.min.js'))
    .pipe(gulp.dest('./www/js'))
    .pipe(livereload());
});

gulp.task('compress-js', function() {
  gulp.src([
    './www/js/app.js'
  ])
    .pipe(ngAnnotate())
    .pipe(concat('code.min.js'))
    .pipe(gulp.dest('./www/js'))
    .pipe(livereload());
});

// JSHint task
gulp.task('lint', function() {
  gulp.src(paths.js)
      .pipe(jscs())
      .pipe(jshint())
      .pipe(jshint.reporter('default'))
      .pipe(livereload());
});

gulp.task('sass', function(done) {
  gulp.src('./scss/ionic.app.scss')
    .pipe(sass({onError: function(e) { console.log(e); } }))
    .pipe(autoprefixer('last 2 versions', 'Chrome', 'ios_saf','Android'))
    .pipe(gulp.dest('./www/css/'))
    .pipe(minifyCss({
      keepSpecialComments: 0
    }))
    .pipe(rename({ extname: '.min.css' }))
    .pipe(gulp.dest('./www/css/'))
    .on('end', done)
    .pipe(livereload());
});

gulp.task('watch', function() {
  gulp.watch(paths.sass, ['sass']);
  gulp.watch(paths.js, ['lint', 'compress-lib', 'compress-js']);
  livereload.listen(9000);
});

gulp.task('install', ['git-check'], function() {
  return bower.commands.install()
    .on('log', function(data) {
      gutil.log('bower', gutil.colors.cyan(data.id), data.message);
    });
});

2 个答案:

答案 0 :(得分:1)

开发期间的Live Reload App(测试版)

run或emulate命令会将应用程序部署到指定的平台设备/模拟器。您还可以通过添加--livereload选项在指定的平台设备上运行实时重新加载。实时重新加载功能类似于离子服务,但不是使用标准浏览器开发和调试应用程序,编译的混合应用程序本身正在监视其文件的任何更改并在需要时重新加载应用程序。这减少了为小变化不断重建应用程序的要求。但是,对插件的任何更改仍然需要完全重建。要使实时重新加载工作,开发机器和设备必须位于同一本地网络上,并且设备必须支持Web套接字。

启用实时重新加载后,还可以通过包含--consolelogs或-c选项将应用程序的控制台日志打印到终端/命令提示符。此外,可以使用--serverlogs或-s选项打印出开发服务器的请求日志。

用于运行和模拟的命令行标志/选项:

[--livereload|-l] .......  Live Reload app dev files from the device (beta)
[--consolelogs|-c] ......  Print app console logs to Ionic CLI (live reload req.)
[--serverlogs|-s] .......  Print dev server logs to Ionic CLI (live reload req.)
[--port|-p] .............  Dev server HTTP port (8100 default, live reload req.)
[--livereload-port|-i] ..  Live Reload port (35729 default, live reload req.)
[--debug|--release]

当服务器正在运行以进行实时重新加载时,您可以在CLI中使用以下命令:

restart or r to restart the client app from the root
goto or g and a url to have the app navigate to the given url
consolelogs or c to enable/disable console log output
serverlogs or s to enable/disable server log output
quit or q to shutdown the server and exit

答案 1 :(得分:0)

如果使用browsersync

//阻止浏览器自动打开

open: false

https://www.browsersync.io/docs/options

browserSync.init({
    proxy: 'localhost:8000',
    open: false,
    browser: "google chrome",
    files: [
        './**/*.php'
    ]
});