Question

我对大多数所有这些工具都很陌生（grunt，browserify，handlebars）。我设置gruntfile.js来监视几个.js文件的保存，然后自动运行默认的browserify bundle命令。这是我目前的gruntfile.js：

module.exports = function(grunt) {
  grunt.initConfig({
    pkg: grunt.file.readJSON('node_modules/grunt/package.json'),
    watch: {
      js: {
        files: ['tvguide.js', 'responsive-tables.js'],
        tasks: ['browserify']
      }
    },
    browserify: {
      js: {
        src: ['responsive-tables.js','tvguide.js'],
        dest: 'bundle.js'
      }
    }
  });

  grunt.loadNpmTasks('grunt-contrib-watch');
  grunt.loadNpmTasks('grunt-contrib-handlebars');
  grunt.loadNpmTasks('grunt-browserify');
  grunt.registerTask('default', ['watch', 'browserify']);
};

这很好用 - 虽然文件和src可能是多余的。但是，我已经充实了我的应用程序，我想使用把手进行模板化，许多谷歌搜索带有把手的browserify导致我进入这个npm包hbsfy。说明我会运行browserify -t hbsfy myscriptusingatemplate.js > bundle.js我希望在保存特定.js文件时自动运行此命令，但我不确定如何同时使用-o和{{1}在相同或不同的文件上。

我尝试使用选项对象，但没有任何结果。任何帮助/建议将不胜感激。

Answer 1

如果您想使用Grunt中的hbsfy，请使用以下配置：

browserify: {
    js: {
        src: ['responsive-tables.js','tvguide.js','tmpl/**/*.handlebars'],
        dest: 'bundle.js'
    },
    options: {
        transform: ['hbsfy']
    }
}

这样，您根本不需要使用grunt-contrib-handlebars。

另外，我建议不要使用grunt-contrib-watch，而是将'watch'选项设置为browserify为true。

Gruntfile与grunt-contrib-watch，browserify和hbsfy（把手） - 自动转换

1 个答案: