Gulp 浏览器同步+;用铬重新装填

Gulp 浏览器同步+;用铬重新装填,gulp,stylus,browser-sync,Gulp,Stylus,Browser Sync,在这里提问之前,我试图找到类似的关于库存过剩的主题,但没有多大帮助。这是我的主题。我正在使用浏览器同步+gulp,在重新加载和观看时遇到问题。我有gulpfile,当我运行gulp时,它应该监视并重新加载所有发生但没有发生的更改。它会编译,但不再继续观察,并通知我。我必须手动在浏览器中重新加载我的页面,这是我的代码: var gulp = require('gulp'), jade = require ('gulp-jade'), stylus = require ('gulp-

在这里提问之前,我试图找到类似的关于库存过剩的主题,但没有多大帮助。这是我的主题。我正在使用浏览器同步+gulp,在重新加载和观看时遇到问题。我有gulpfile,当我运行gulp时,它应该监视并重新加载所有发生但没有发生的更改。它会编译,但不再继续观察,并通知我。我必须手动在浏览器中重新加载我的页面,这是我的代码:

var gulp = require('gulp'),
    jade = require ('gulp-jade'),
    stylus = require ('gulp-stylus'),
    watch = require ('gulp-watch'),
    plumber =  require('gulp-plumber'),
    browserSync = require ('browser-sync').create(),
    poststylus = require ('poststylus'),
    lost = require ('lost');

// JADE
gulp.task('jade', function(){
    return gulp.src('app/jade/*.jade')
        .pipe(plumber())
        .pipe(jade({pretty:true}))
        .pipe(gulp.dest('build/'))
});

// STYLUS
gulp.task('stylus', function(){
    return gulp.src('app/stylus/*.styl')
        .pipe(plumber())
        .pipe(stylus({use:[poststylus(['lost'])]}))
        .pipe(gulp.dest('build/css'))
});

gulp.task('browser-watch', ['jade', 'stylus'], browserSync.reload);


gulp.task('serve', function(){

    browserSync({
        server: {
            baseDir: './'
        }
    });

    gulp.watch('app/jade/*.jade', 'app/stylus/*.styl', ['browser-watch']);
});


// DEFUALT
gulp.task('default', ['browser-watch', 'serve']);
通知如下:

$ gulp
    [20:34:23] Using gulpfile c:\Users\Bogdan\Desktop\projects\lost\gulpfile.js
    [20:34:23] Starting 'jade'...
    [20:34:23] Starting 'stylus'...
    [20:34:23] Starting 'serve'...
    [20:34:23] 'serve' errored after 239 μs
    [20:34:23] TypeError: object is not a function
        at Gulp.<anonymous> (c:\Users\Bogdan\Desktop\projects\lost\gulpfile.js:31:2)
        at module.exports (c:\Users\Bogdan\Desktop\projects\lost\node_modules\gulp\node_modules\orchestrator\lib\runTask.js:34:7)
        at Gulp.Orchestrator._runTask (c:\Users\Bogdan\Desktop\projects\lost\node_modules\gulp\node_modules\orchestrator\index.js:273:3)
        at Gulp.Orchestrator._runStep (c:\Users\Bogdan\Desktop\projects\lost\node_modules\gulp\node_modules\orchestrator\index.js:214:10)
        at Gulp.Orchestrator.start (c:\Users\Bogdan\Desktop\projects\lost\node_modules\gulp\node_modules\orchestrator\index.js:134:8)
        at c:\Users\Bogdan\AppData\Roaming\npm\node_modules\gulp\bin\gulp.js:129:20
        at process._tickCallback (node.js:355:11)
        at Function.Module.runMain (module.js:503:11)
        at startup (node.js:129:16)
        at node.js:814:3
    Container#eachAtRule is deprecated. Use Container#walkAtRules instead.
    Container#eachDecl is deprecated. Use Container#walkDecls instead.
    Node#removeSelf is deprecated. Use Node#remove.
    [20:34:23] Finished 'jade' after 412 ms
    [20:34:23] Finished 'stylus' after 390 ms
$gulp
[20:34:23]使用gulpfile c:\Users\Bogdan\Desktop\projects\lost\gulpfile.js
[20:34:23]开始“jade”。。。
[20:34:23]正在启动“触控笔”。。。
[20:34:23]开始“发球”。。。
[20:34:23]“发球”在239μs后出错
[20:34:23]类型错误:对象不是函数
狼吞虎咽。(c:\Users\Bogdan\Desktop\projects\lost\gulpfile.js:31:2)
在module.exports(c:\Users\Bogdan\Desktop\projects\lost\node\u modules\gulp\node\u modules\orchestrator\lib\runTask.js:34:7)
位于Gulp.Orchestrator.\u runTask(c:\Users\Bogdan\Desktop\projects\lost\node\u modules\Gulp\node\u modules\Orchestrator\index.js:273:3)
位于Gulp.Orchestrator.\u runStep(c:\Users\Bogdan\Desktop\projects\lost\node\u modules\Gulp\node\u modules\Orchestrator\index.js:214:10)
在Gulp.Orchestrator.start(c:\Users\Bogdan\Desktop\projects\lost\node\u modules\Gulp\node\u modules\Orchestrator\index.js:134:8)
在c:\Users\Bogdan\AppData\Roaming\npm\node\u modules\gulp\bin\gulp.js:129:20
在进程中调用(node.js:355:11)
位于Function.Module.runMain(Module.js:503:11)
启动时(node.js:129:16)
在node.js:814:3
容器#每个规则都已弃用。改用容器#walkatrales。
容器#eachDecl已弃用。改用容器#walkDecls。
不推荐使用节点#removeSelf。使用节点#删除。
[20:34:23]412毫秒后完成“翡翠”
[20:34:23]390毫秒后完成“触控笔”

知道我做错了什么吗?

试试这个:

我知道这部分在你的“发球”任务中是错误的:

gulp.watch('app/jade/*.jade','app/stylus/*.styl',['browser-watch'])

应将源放在数组中以监视“多个文件”

gulp.watch(['app/jade/*.jade','app/stylus/*.styl',['browser-watch'])


另一方面,我不知道“poststylus”。看起来棒极了!祝你好运

问题不在于poststylus,而在于lost plugin,它的100%。您现在在项目中使用的lost版本使用了不推荐的POSTSS方法。 尝试将其从包中删除,然后添加(或简单地更新): sudo npm卸载--保存开发丢失 sudo npm安装--保存丢失的开发

它对我起了作用——不推荐的removeSelf通知消失了


问题在两天前解决了:

谢谢,因为我的终端没有读取命令“sudo”(不知道为什么),我试图在没有它的情况下重新安装它。