在Angular项目中使用gulp处理html partials

-client/ 
    index.html 
    node_modules/ 
     .. 
     .. 
    js/ 
     -controllers/ 
     -directives/ 
     -services/ 
     app.js 
    partials/ 
     someHTML.html 
     anotherHTML.html 
    build/ 
     -app.js 
     -custom.css 
     ... 

-server 
    server.js

Angular指令，控制器等使用的所有部分html模板都驻留在build文件夹中。我使用gulp来构建项目，它执行所有常见任务，如清理目标文件夹，编译手写笔并将其放置在构建文件夹中，移动bootstrap.css来构建文件夹，浏览.js文件并创建文件夹。到目前为止这么好..但是，如何处理partials文件夹中的html模板？在Angular项目中使用gulp处理html partials

这些只是被复制到生成文件夹？

按@JimL建议..我用browserify目前在我的主要app.js看起来像这样

/*jshint globalstrict: true*/ 
'use strict'; 

require('es5-shim'); 
require('es5-sham'); 
require('jquery'); 
require('angular'); 

var app = angular.module('app', [require('angular-ui-router')]); 

require('./controllers'); 
require('./directives'); 
require('./services');

现在，如何做模板缓存适合在上面的方程？ template.js文件被创建并放置在构建文件夹中。但这还不适用于browserify。

来源

2014-12-06 runtimeZero

我建议你使用[模板缓存（https://github.com/miickel/gulp-angular-templatecache）所有HTML文件Concat的到一个单一的js文件。更容易加载（甚至可以包含在你的app.min.js文件中），并且对于每个部分只有一个模板请求而不是一个的用户来说很好:) – JimL 2014-12-06 14:52:34

现在我的指令/控制器使用诸如''的路径。 ./partials/someTemplate.html'..一旦我包含模板缓存，这将如何更改？ – runtimeZero 2014-12-06 15:13:41

除了“文件夹”，它不会改变:)你以同样的方式引用缓存的文件 – JimL 2014-12-06 15:15:19

您应该尝试使用诸如Gulp Angular Templatecache这样的工具，它将使用$ templateCache服务直接在应用程序中捆绑模板。

var templateCache = require('gulp-angular-templatecache'); 

gulp.task('html', function() { 
    gulp.src('templates/**/*.html') 
     .pipe(templateCache()) 
     .pipe(gulp.dest('public')); 
});

https://www.npmjs.com/package/gulp-angular-templatecache

来源

2014-12-21 22:38:47 postrational

在Angular项目中使用gulp处理html partials

回答

相关问题