当我使用gulp和browser-sync时,它犯了一个错误

时间:2016-12-19 08:11:17

标签: javascript gulp browser-sync

当我更改HTMLCSS中的代码时,它会响应:

  

[BS]重新加载浏览器......   [15:34:19]完成' browserSync'在1.46毫秒之后   / c / Users / weiyinpeng / AppData / Roaming / npm / gulp:第14行:8084分段故障节点" $ basedir / node_modules / gulp / bin / gulp.js" " $ @"

这是我的gulpfile.js代码。

        let gulp = require("gulp");
    let browserSync = require("browser-sync").create();
    let postcss = require("gulp-postcss");
    let autoprefixer = require("autoprefixer-core");
    let postcssSimpleVars = require("postcss-simple-vars");
    let postcssMixins = require("postcss-mixins");
    let postcssNested = require("postcss-nested");
    let sourcemaps = require("gulp-sourcemaps");
    let babel = require("gulp-babel")
    let concat = require("gulp-concat")
    let rename = require("gulp-rename")
    let md5 = require("gulp-md5")
    let uglify = require("gulp-uglify")
    let pump = require("pump")
    let del = require("del")
    // Css process.
    gulp.task("PC-postcss", ()=>{
        var processors = [
            postcssMixins,
            postcssSimpleVars,
            postcssNested,
            autoprefixer({
                // browsers: ['last 20 version', 'safari > 5', 'ff > 31', 'opera 12.1', 'IOS 6', 'IE > 7', 'Android 4','> 10%']
                browsers: ['last 2 version', 'safari > 5', 'ff > 31', 'opera 12.1', 'IOS 6', 'IE 8', 'Android 4','> 1%']


            })];

        return gulp.src(["./today-pc/**/*.scss"])
            .pipe(postcss(processors))
            .pipe(rename({
                extname:".css"
            }))
            .pipe(gulp.dest("./today-pc/"));

    });
    // Css process.
    gulp.task("M-postcss", ()=>{
        var processors = [
            postcssMixins,
            postcssSimpleVars,
            postcssNested,
            autoprefixer({
                browsers: ['last 2 version']
            })];

        return gulp.src(["./today-m/**/*.scss"])
            .pipe(postcss(processors))
            .pipe(rename({
                extname:".css"
            }))
            .pipe(gulp.dest("./today-m/"));

    });
    gulp.task("textConcat", ()=>{
        gulp.src("fuck/*.js")
            .pipe(babel({
                presets:["es2015"]
            }))
            .pipe(concat("all.js"))
            .pipe(gulp.dest("dest"))
    })
    // 名字不能用index.js,today.js 编译后称today-concat.js
    gulp.task("es2015", function (){
        gulp.src("./**/today.js")
        .pipe(babel({
            presets :["es2015"]
        }))
        .pipe( rename(function(path) {
            path.basename += "-concat";
        }) )
        .pipe(gulp.dest("./"))
    })
    // 改名
    gulp.task("testRename",()=>{
        gulp.src("fuck/demo.js",{base:process.cwd()})
            .pipe(rename({
                dirname:"main/text/ciao",
                basename:"aa",
                prefix:"bonjour-",
                suffix:"-hold",
                extname:".jsd"
            }
                ))
            .pipe(gulp.dest("dest"))
    })
    // md5的文件名字编译
    gulp.task("md5",()=>{
        gulp.src("fuck/demo3.js")
            .pipe(md5({
                cwd:"dest/"
            }))
            .pipe(md5())
            .pipe(gulp.dest("dest/"))
    })
    // js压缩
    gulp.task("uglify1",()=>{
            gulp.src("fuck/demo4.js")
            .pipe(uglify())
            .pipe(gulp.dest("dest"))
    })
    gulp.task("jsmin",  ()=> {
        gulp.src("src/js/index.js")
            .pipe(uglify())
            .pipe(gulp.dest("dist/js"));
    });
    // 保存同步浏览器
    gulp.task("browserSync", ()=>{
        browserSync.reload();
    })
    gulp.task("pc-server",["PC-postcss","es2015"], ()=>{
        browserSync.init({
            server: "today-pc/"
        });
        gulp.watch("./today-pc/**/*.scss", ["PC-postcss"]);
        gulp.watch("./today-pc/**/today.js", ["es2015"]);
        gulp.watch(["./today-pc/**/today-concat.js","./today-pc/**/index.css","./today-pc/**/*.html"], ["browserSync"]);
    })
    gulp.task("m-server",["M-postcss","es2015"], ()=>{
        browserSync.init({
            server: "today-m/"
        });
        gulp.watch("./today-m/**/*.scss", ["M-postcss"]);
        gulp.watch("./today-m/**/today.js", ["es2015"]);
        gulp.watch(["./today-m/**/today-concat.js","./today-m/**/index.css","./today-m/**/*.html"], ["browserSync"]);
    })
    gulp.task("default",["pc-server"])

1 个答案:

答案 0 :(得分:0)

我已经检查了我的代码几天,并发现它有什么问题。 PC-postcss中的任务应改为:

gulp.task("PC-postcss", ()=>{
    var processors = [
        postcssMixins,
        postcssSimpleVars,
        postcssNested,
        autoprefixer({ 
            browsers: ['last 2 version', 'safari > 5', 'ff > 31', 'opera 12.1', 'IOS 6', 'IE 8', 'Android 4','> 1%'] 
        })];

    return gulp.src(["./today-pc/static/css/*.scss"])
        .pipe(postcss(processors))
        .pipe(rename({
            extname:".css"
        })) 
        .pipe(gulp.dest("./today-pc/static/css/"))
         // .pipe(browserSync.stream());

});

gulp.src中的路径是错误的。在gulp的Path分析中,路径中必定出错。谢谢你们。我第一次使用stackoverflow,我很抱歉我曾经做过的。