用Gulp将工具栏模板预编成单独的JST (.js)文件

Question

我最近刚从grunt迁移到gulp，我想将我的车把模板(带有.handlebars扩展名)预编编译成单独的.js文件。

出发地：

• www/模板/login.handlebar
• www/模板/home.handlebars.工具栏

to:

• www/模板/login.js
• www/模板/home.js.www

我正试着用口服液，但没有用。许多npm包要求您将数据传递给编译器，但是我的web应用程序中的数据主要是从ajax请求中收集的，然后传递给工具栏模板。

My gulpfile.js:

// cache vars
var gulp = require('gulp'),
    rename = require('gulp-rename'),
    handlebars = require('gulp-compile-handlebars');

// start task
gulp.task('default', function(){

    return gulp.src( 'www/templates/*.handlebars' )
        .pipe( handlebars() )
        .pipe( rename('*.js') )
        .pipe( gulp.dest( 'www/templates' ) );
    });

});

我从Grunt迁移到Gulp的主要原因是grunt似乎不支持更新的车把版本(链接在这里)。

有很多例子，如何编译手棒模板，但不是以我想要的方式(我的方式可能吗？)

而且，如果可能的话，我也不想将我的工具栏js文件包装到名称空间中。

当我运行我的gulp任务时，没有一个.js文件产生任何想法？

Answer 1

我有个不太干净的解决方案。我使用的是pump + gulp，因为如果处理管道时出了问题，那么清理源代码是个好主意。

在gulpfile.js中

const pump = require( 'pump' )
const handlebars = require( 'gulp-handlebars' )

gulp.task( 'default', ( done ) => {

    const templates = [
        'login',
        'home'
    ] // <-- You may want to get the list of files programmatically ;)

    let pipe = []

    templates.forEach( ( template ) => {
        pipe.push( gulp.src( 'www/templates/' + template + '.handlebars' ) )
        pipe.push( handlebars() )
        pipe.push( gulp.dest( 'www/templates/' ) )
    } )

    pump( pipe, done )

} )