如何使用 Karma 配置 browserify 以将转换 Stringify 用于 Mustache 模板？答案

【问题标题】：How to configure browserify with Karma to use transform Stringify for Mustache templates?如何使用 Karma 配置 browserify 以将转换 Stringify 用于 Mustache 模板？
【发布时间】：2015-04-04 07:55:51
【问题描述】：

我有一个项目，我正在使用 browserify 来管理我的依赖项。我在客户端使用 Backbone with Mustache 作为模板引擎。要要求 Mustache 模板，我必须像下面这样使用 Stringify 才能正确要求 Mustache 模板：

gulp.task('scripts', function() {
    gulp.src(['./js/app.js'])
        .pipe(browserify({
          transform: stringify({
            extensions: ['.html'], minify: true
          })
        }))
        .pipe(gulp.dest('dist/assets/js')) });

现在，我的测试在带有 browserify 的 Karma 上运行。但是，当我尝试要求模板时，Karma 无法引发 HTML 文件解析错误。

例如：

var Template = require('../Templates/CodeEditor.html'); var CodeEditor
= Backbone.View.extend({

    el: '#CodeEdit',

    editor: {},     currentPreviewMode: "default",

    template: function() {
        return Mustache.to_html(Template, this.model.toJSON());
} });

是否可以将 Karma 配置为使用 Stringify？如果有怎么办？请帮忙。

以下是我的 Kara 配置。

module.exports = function(config) {   config.set({
    basePath: './js/',
    frameworks: ['browserify', 'jasmine'],
    browserify: {
      debug: true,
      transform: [ 'brfs', 'browserify-shim']
    },
    files: [
        '**/**/*.js'
    ],

    exclude: [],
    preprocessors: {
      'modules/**/*.js': [ 'browserify' ]
    },
    reporters: ['dots'],
    port: 9876,
    colors: true,
    logLevel: config.LOG_INFO,
     autoWatch: true,
    browsers: [ 'PhantomJS' ],
    singleRun: false   }); };

以及部分package.json供参考：

  "devDependencies": {
    "brfs": "^1.4.0",
    "browserify": "^9.0.3",
    "browserify-shim": "^3.8.3",
    "chai": "^2.2.0",
    "del": "^1.1.1",
    "gulp": "^3.8.11",
    "gulp-autoprefixer": "^2.1.0",
    "gulp-browserify": "^0.5.1",
    "jasmine": "^2.2.1",
    "jasmine-core": "^2.2.0",
    "karma": "^0.12.31",
    "karma-browserify": "^4.1.2",
    "karma-chrome-launcher": "^0.1.7",
    "karma-phantomjs-launcher": "^0.1.4",
    "karma-jasmine": "^0.3.5",
    "map-stream": "0.0.5",
    "stringify": "^3.1.0"


  },

  "browserify-shim": {
    "jQuery": "global:jQuery",
    "Backbone": "global:Backbone"
  }

谢谢

【问题讨论】：

标签： javascript karma-runner mustache browserify stringify

【解决方案1】：

看看这个。可能是您正在寻找的。p>

只需添加

browserify: {
    transform: ['stringify']
},

到您的 karma.conf.js（并确保将 stringify 作为节点模块安装）

https://gist.github.com/busypeoples/e4ec7e7c1f1a753050dd

更新：您还可以向转换本身添加选项，例如

transform: [
    ['stringify', {extensions: ['.java'], minify: true}]
]

https://github.com/Nikku/karma-browserify#transforms

【讨论】：