在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

回答

相關問題