3

我最近刚从grunt转到gulp，我想将我的车把模板（扩展名为 .handlebars）预编译成单独的 .js 文件。

从：

  • www/templates/login.handlebars
  • www/templates/home.handlebars

至：

  • www/templates/login.js
  • www/templates/home.js

我正在尝试使用 gulp 但无济于事。许多 npm 包要求您将数据传递给编译器，但我的 web 应用程序中的数据主要是从 ajax 请求中收集的，然后传递给车把模板。

我的 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 文件产生任何想法？

4

1 回答 1

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 )

} )
于 2017-02-12T02:31:27.753 回答