Question

我有一个运行Sass的gulp文件，并在单独的任务中注入我的CSS，app和Bower js文件。在任务结束时，我希望观察我的SCSS文件，并在更改时运行Sass，并运行应用程序代码并注入新文件（以便在我能够正常工作时进行实时重载）。

不幸的是，我遇到了一个问题，即我的监视任务提前结束，因此没有观察到任何变化。

我已经在另一个question中读到必须返回监视任务，但是，这没有帮助......

这是我的gulpfile（删除了prod任务）

const gulp = require('gulp')
// plugins
const concat = require('gulp-concat')
const uglify = require('gulp-uglify')
const rename = require('gulp-rename')
const closure = require('gulp-jsclosure')
const rev = require('gulp-rev')
const sass = require('gulp-sass')
const cssmin = require('gulp-cssmin')
const bower = require('main-bower-files')
const strip = require('gulp-strip-comments')
const inject = require('gulp-inject')
const ngannotate = require('gulp-ng-annotate')
const mainBowerFiles = require('main-bower-files')
const templateCache = require('gulp-angular-templatecache')
const minifyHtml = require('gulp-minify-html')
const path = require('path')
const babel = require('gulp-babel')
const es = require('event-stream')

// configuration variables
const config = {
    dir: {
        root: 'client/',
        app: './Dist/',
        vendor: './Dist/',
        css: 'client/',
        cssMin: './Dist/',
        bower: 'client/wwwroot/lib',
        index: './Views/Shared/_Layout.cshtml',
        indexDir: './Views/Shared',
        modules: 'client/app/modules'
    },
    filters: {
        app: 'client/app.js',
        appModules: 'client/app/modules/**/*.module.js',
        appModuleFiles: 'client/app/modules/**/*.js',
        vendors: 'client/vendors/**/*.js',
        templates: 'client/app/modules/**/*.html',
        client: 'client/app/css/**/*.scss'
    }
}

//----------CSS---------
gulp.task('sass', () => {
    return gulp.src(['client/app/css/bootstrap.scss', 'client/app/css/app.scss', 'client/app/css/themes/theme-f.scss'])
        .pipe(sass().on('error', sass.logError))
        .pipe(gulp.dest('build/css'));
})

gulp.task('inject-css', ['sass'], () => {

    var sources = gulp.src(['build/css/bootstrap.css', 'build/css/app.css', 'build/css/theme-f.css'], { read: false }, { name: 'css' });

    return gulp.src(config.dir.index)
        .pipe(inject(sources))
        .pipe(gulp.dest(config.dir.indexDir));
})

//--------End CSS-------


//----------App---------
gulp.task('inject-js', ['inject-bower'], () => {

    var sources = gulp.src([config.filters.app, config.filters.appModules, config.filters.appModuleFiles], { read: false });

    return gulp.src(config.dir.index)
        .pipe(inject(sources))
        .pipe(gulp.dest(config.dir.indexDir));
})
//--------End App-------


//---------Vendor-------
gulp.task('inject-bower', ['inject-css'], () => {

    let bower = gulp.src(mainBowerFiles(), { read: false }, { relative: true })

    return gulp.src(config.dir.index)
        // .pipe(inject(es.merge(bower, vendors), { name: 'vendor' }))
        .pipe(inject(bower, { name: 'vendor' }))
        .pipe(gulp.dest(config.dir.indexDir));
})
//-------End Vendor-----


//----------Prod--------

//---------Watches-------
gulp.task('scripts:watch', () => {
    return gulp.watch([config.filters.app, config.filters.appModuleFiles], ['inject-js']);
})


gulp.task('sass:watch', () => {
    return gulp.watch(config.filters.scss, ['sass']);
})

gulp.task('watch', ['scripts:watch', 'sass:watch'], () => {
    console.log(" ");
    console.log("Watching for changes...");
    console.log(" ");
})

//-------End Watches-----

//----------Tasks--------

gulp.task('default', ['inject-js', 'inject-bower', 'inject-css',' watch'], () => {

    // gulp.watch([config.filters.app, config.filters.appModuleFiles], ['inject-js'])
    // gulp.watch(config.filters.scss, ['sass'])
})

正如您可以从注释掉的代码中看到的那样，我也尝试直接在默认任务中运行这些内容。

这是运行gulp

的控制台输出

[12:48:12] Using gulpfile C:\source\Icon.Admin\src\UI\Icon.Admin\gulpfile.js
[12:48:12] Starting 'scripts:watch'...
[12:48:12] Finished 'scripts:watch' after 145 ms
[12:48:12] Starting 'sass:watch'...
[12:48:12] Finished 'sass:watch' after 180 μs
[12:48:12] Starting 'watch'...

Watching for changes...

[12:48:12] Finished 'watch' after 159 μs

非常感谢任何帮助！

Answer 1

通过在主要监视任务中运行我的监视任务来解决此问题：

import wx
import sys, glob

class DemoFrame(wx.Frame):
 def __init__(self):
    wx.Frame.__init__(self, None, -1,"wx.ListCtrl in wx.LC_ICON mode",size=(600,400))
    il_max=0
    il = wx.ImageList(200,200)
    for name in glob.glob("img/*.bmp"):
        bmp = wx.Bitmap(name, wx.BITMAP_TYPE_BMP)

        il_max = il.Add(bmp)

    self.list = wx.ListCtrl(self, -1, style=wx.LC_ICON | wx.LC_AUTOARRANGE)

    self.list.AssignImageList(il, wx.IMAGE_LIST_NORMAL)

    for x in range(25):
        img = x % (il_max+1)
        self.list.InsertImageStringItem(x, "This is item %02d" % x, img)

 app = wx.PySimpleApp()
 frame = DemoFrame()
 frame.Show()
 app.MainLoop()

Answer 2

好吧，在你的<link href='https://cdn.jsdelivr.net/bxslider/4.2.5/jquery.bxslider.css' rel='stylesheet'> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src='https://cdn.jsdelivr.net/bxslider/4.2.5/jquery.bxslider.min.js'></script> <ul class='bx'> <li class='slide'> <img src='http://placehold.it/150x150/000/fff?text=1'> </li> <li class='slide'> <img src='http://placehold.it/150x150/00f/eee?text=2'> </li> <li class='slide'> <img src='http://placehold.it/150x150/0e0/111?text=3'> </li> <li class='slide'> <img src='http://placehold.it/150x150/f00/fff?text=4'> </li> <li class='slide'> <img src='http://placehold.it/150x150/fc0/000?text=5'> </li> <li class='slide'> <img src='http://placehold.it/150x150/fff/000?text=6'> </li> <li class='slide'> <img src='http://placehold.it/150x150/000/fff?text=7'> </li> <li class='slide'> <img src='http://placehold.it/150x150/00f/eee?text=8'> </li> <li class='slide'> <img src='http://placehold.it/150x150/0e0/111?text=9'> </li> <li class='slide'> <img src='http://placehold.it/150x150/f00/fff?text=10'> </li> <li class='slide'> <img src='http://placehold.it/150x150/fc0/000?text=11'> </li> <li class='slide'> <img src='http://placehold.it/150x150/fff/000?text=12'> </li> <li class='slide'> <img src='http://placehold.it/150x150/fff/fff?text=13'> </li> </ul> <div class='nextPostLink'>Next Post Link</div>内，它引用sass:watch但是在配置对象中找不到。可能是为什么你的scss没有编译。

config.filters.scss

这应该是你所需要的。

Gulp Watch任务提前完成

2 个答案: