javascript - 将 chrome devtools 与 browsersync & --inspect 一起使用

Question

我一辈子都无法锻炼如何使用新的 --inspect 和浏览器同步

gulp.task('browser-sync', ['nodemon'], function () {
    browserSync({
        proxy: 'localhost:17230',
        port: 5000,
        notify: true,
        debug: true
    });
});

我试过 debug true，但这也没有任何作用:(

Answer 1

几个月前我遇到了同样的问题。您可以使用 nodeArgs 将适当的参数传递给 Node 二进制文件，或者，exec 选项也可以。

const nodemon = require('gulp-nodemon');
const browserSync = require('browser-sync');

gulp.task('browser-sync', ['nodemon'], function () {
    browserSync({
        proxy: 'localhost:17230',
        port: 5000,
        notify: true,
        debug: true
    });
});

gulp.task('nodemon', function() {
  let started = false;
  nodemon({
    nodeArgs: ['--inspect=0.0.0.0:17230'], // localhost + port
    // You may also use {exec: 'node --inspect'}
    ext: 'js',
    ignore: ['.idea/*', 'node_modules/*'],
    script: 'server.js',
    tasks: ['lint'],
    verbose: true
    delay: 2000
  })
  .on('start', () => {
    // to avoid nodemon being started multiple times
    if (!started) {
      setTimeout(() => done(), 100);
      started = true;
    }
  });
});