美文网首页
2019-06-11 browser-sync 在浏览器不刷新的

2019-06-11 browser-sync 在浏览器不刷新的

作者: xxxcremove | 来源:发表于2019-06-11 22:18 被阅读0次

    注意到,具体刷新的时候,我的配置是这样的

    gulp.watch("app/*.html").on('change', browserSync.reload);
    

    而之前的配置无效?"/**/*.html" 但是可以监听到,但是reload不能够

    其二:
    reload("index.html") 重载某一个是可以的

    // gulpfile.babel.js
    // Skip to content
    // Gulp 4 + Browsersync
    //  gulpfile.babel.js
    import gulp from 'gulp';
    import babel from 'gulp-babel';
    import browserSync from 'browser-sync';
    import del from 'del';
    
    const server = browserSync.create();
    
    const paths = {
      scripts: {
        src: 'src/scripts/**/*.js',
        dest: 'dist/scripts/'
      },
      styles: {
        src: 'src/styles/**/*.css',
        dest: 'dist/styles/'
      },
      html: {
        src: 'src/*.html',
        dest: 'dist/'
      },
      images: {
        src: 'src/images/**/*.{jpg, jpeg, png, svg}',
        dest: 'build/images/'
      }
    };
    
    
    /**********    Build tasks    **********/
    
    // Delete dist folder
    export const clean = () => del(['dist']);
    
    // Process and uglify js, copy to dist folder
    export function scripts() {
      return gulp.src(paths.scripts.src)
        .pipe(gulp.dest(paths.scripts.dest));
    }
    
    // Process and minify css, copy to dist folder
    export function styles() {
      return gulp.src(paths.styles.src)
        .pipe(gulp.dest(paths.styles.dest))
    }
    
    // Copy html to dist folder
    export function html() {
      return gulp.src(paths.html.src)
        .pipe(gulp.dest(paths.html.dest));
    }
    
    
    /**********    Image Handling    **********/
    
    // Minify images and copy to build folder
    export function images() {
      return gulp.src(paths.images.src, { since: gulp.lastRun(images)})
        .pipe(gulp.dest(paths.images.dest));
    }
    
    
    /**********    Development    **********/
    
    // Start serving src folder
    export function serve(done) {
      server.init({
        server: {
          baseDir: './src'
        }
      });
      done();
    }
    
    // Reload the server
    export function reload(done) {
      server.reload('index.html');
      done();
    }
    
    // Watch files for changes and reload server
    export function watch() {
      gulp.watch(paths.scripts.src, gulp.series(scripts, reload));
      gulp.watch(paths.styles.src, gulp.series(styles, reload));
      gulp.watch(paths.html.src, gulp.series(html, reload));
    }
    
    // Build dist folder, start server, and watch files
    const build = gulp.series(clean, gulp.parallel(scripts, styles, html, images), serve, watch);
    
    // Set build as default task
    export default build;
    
    // .babelrc
    {
      "presets": [
        "@babel/preset-env"
      ]
    }
    

    相关文章

      网友评论

          本文标题:2019-06-11 browser-sync 在浏览器不刷新的

          本文链接:https://www.haomeiwen.com/subject/cakcfctx.html