javascript - 如何修复模板缓存中的模板路径？ (gulp-angular-templatecache)

Question

我正在使用 gulp-angular-templatecache生成一个 templateCache.js 文件，它将我所有的 HTML 模板文件合并为 1。(my full gulpfile)

将该新模块注入(inject)我的应用程序后，我的指令将自动获取模板，我不需要将部分 .html 文件添加到我的构建文件夹中。

问题是主要文件夹路径被切断，请参见下面的示例:

我的指令中的路径:

templateUrl : "panels/tags/tagsPanel.html"...
templateUrl : "header/platform_header/platformHeader.html"...

我生成的 templateCache 文件中的路径:

$templateCache.put("tags/tagsPanel.html"...
$templateCache.put("platform_header/platformHeader.html"...

^ panels和 header正在迷路。



我正在尝试编写一个可以在我的 Gulpfile 中修复该问题的函数。

我的 Gulpfile 的配置部分:

var config = {
    srcPartials:[
        'app/beta/*.html', 
        'app/header/**/*.html',
        'app/help/*.html',
        'app/login/*.html',
        'app/notificaitons/*.html',
        'app/panels/**/*.html',
        'app/popovers/**/*.html',
        'app/popovers/*.html',
        'app/user/*.html',
        'app/dashboard.html'
    ],
    srcPaths:[
        'beta/', 
        'header/',
        'help/',
        'login/',
        'notificaitons/',
        'panels/',
        'popovers/',
        'popovers/',
        'user/',
        'dashboard.html'
    ],
    destPartials: 'app/templates/'
};

我的 html-templates gulp 任务

gulp.task('html-templates', function() {
    return gulp.src(config.srcPartials)
    .pipe(templateCache('templateCache.js', {
        root: updateRoot(config.srcPaths)
    },
    { module:'templateCache', standalone:true })
    ).pipe(gulp.dest(config.destPartials));
});

function updateRoot(paths) {
    for (var i = 0; i < paths.length; i++) {
        // console.log(paths);
        console.log(paths[i]);
        return paths[i];
    }
}

^ 以上是有效的，因为它使用 root option在 gulp-angular-templatecache在模板路径前面附加一个新字符串。

问题是我上面的代码返回一次并更新路径数组中第一项的所有路径，即 beta/ .

您将如何编写它以正确替换每个文件的路径？

Answer 1

弄清楚了!我不应该使用确切的文件夹名称，而是使用 glob **在我的配置中

var config = {
    srcTemplates:[
        'app/**/*.html',            
        'app/dashboard.html',
        '!app/index.html'
    ],
    destPartials: 'app/templates/'
};

更新后的 gulp.task:

gulp.task('html-templates', function() {
    return gulp.src(config.srcTemplates)
    .pipe(templateCache('templateCache.js', { module:'templateCache', standalone:true })
    ).pipe(gulp.dest(config.destPartials));
});

现在输出是正确的:

$templateCache.put("beta/beta.html"...
$templateCache.put("header/control_header/controlHeader.html"...
$templateCache.put("panels/tags/tagsPanel.html"...