1. ホーム
  2. ジャバスクリプト

[解決済み] templateCacheのテンプレートパスを修正する方法は?(gulp-angular-templatecache)です。

2022-03-03 11:26:19

質問

を使っています。 gulp-angular-templatecache を使用して、すべての HTML テンプレートファイルを 1 つにまとめる templateCache.js ファイルを生成しています。 ( 私の完全なgulpfile )

この新しいモジュールをアプリに注入すると、Directives が自動的にテンプレートをピックアップし、ビルドフォルダに部分的な .html ファイルを追加する必要がなくなります。

問題は、先頭のフォルダーパスが切断されてしまうことです(以下の例を参照してください)。

私のディレクティブのパス

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

制作したtemplateCacheファイル内のパス。

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

^ panelsheader が迷子になっている。

<イグ


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.task

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];
    }
}

^ 上記は動作しています。 ルートオプション gulp-angular-templatecache を追加して、テンプレートのパスの前に新しい文字列を追加します。

問題は、上記のコードが一度だけ戻り、すべてのパスをパス配列の最初のアイテムに更新することです。 beta/ .

各ファイルのパスを正しく置き換えるには、どのように書けばよいのでしょうか。

どのように解決するのですか?

わかったぞ! 正確なフォルダ名ではなく、グロブを使うべきでした。 ** を設定しました。

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"...