我正在使用browserify和ui-router
构建一个小型的angular应用程序。由于我不想使用服务器,所以我希望像这样使用angular的$templateCache
来存储所有我的模板:
exports.templateCache = ["$templateCache", function($templateCache) {
'use strict';
$templateCache.put('partials/someState.html',
"myHtmlCode"
);
}];
为了填充缓存,我使用grunt查看我的“partials”文件夹,获取所有的HTML并使用“grunt-angular-templates”将其加载到缓存中。 ngtemplates: {
myApp: {
cwd: 'dist/',
src: 'partials/**.html',
dest: 'src/js/templates/templates.js',
options: {
bootstrap: function(module, script) {
return 'exports.templateCache = ["$templateCache", function($templateCache) {\n' +
script +
'}];'
}
}
}
},
然后我使用browersify将所有的js文件合并在一起:
browserify: {
dist: {
files: {
'dist/js/app.js': [
'src/js/templates/**',
'src/app.js'
],
}
}
},
到目前为止,这个方法可以工作,但这个工作流程看起来对我来说非常笨重:我有一个中间步骤,在我的src
目录中创建templates.js
文件,而且我的grunt文件中有硬编码的代码。
有没有更优雅的方法来解决这个问题?Browserify是否带有内置的解决方案?