如何用 usemin 替换指向 ui-router 版本控制文件的链接

how to replace links to versioned files of ui-router with usemin

给定以下文件app.js

$stateProvider
      .state('intro', {
        url: '/intro',
        templateUrl: 'partials/intro.html',
        controller: 'IntroController as IntroCtrl'
      })
      .state('search', {
        url: '/search',
        templateUrl: 'partials/search.html',
        controller: 'SearchController as searchCtrl'
      })
      ;

任务是将 templateUrl 文件更改为经过 grunt filerev 修订的修订版。

我有一个带有 grunt 的 usemin 目标

useminPrepare: {// configuration which tasks usemin will change/run
       html: build_src + '/index.html',             
       options: {
            dest: build_dest + '',
        }
},      
usemin: {           
     html: [build_dest + '/index.html'],            
     options: {
            dirs: [build_dest + '', build_dest + '/dist']           
     }      
}

记录了如何在 html 中插入块注释,然后 usemin 执行修订以及修订文件的替换。

javascript文件是如何实现的?

您还需要告诉 usemin 替换 JS 文件中的 "filerev" 映射。

尝试在 usemin 配置中添加 "js" 部分:

usemin: {           
     html: [build_dest + '/index.html'],
     js: ['js/**/*.js']       
     options: {
            dirs: [build_dest + '', build_dest + '/dist']           
     }      
}

此外,您还可以使用 angular $cacheTemplate

将所有 html 文件合并为一个大文件(使用 grunt-html2js)

我继续搜索cetia的答案

我在以下位置找到了解决方案: https://github.com/yeoman/grunt-usemin/issues/235#issuecomment-33316221

usemin: {
            html: [build_dest + '/index.html'],
            js:[build_dest + '/**/*.js'],
            options: {
                dirs:[build_dest, build_dest + '/dist'],
                assetsDirs: [build_dest],
                patterns: {
                      // FIXME While usemin won't have full support for revved files we have to put all references manually here
                      js: [
                          [/(partials\/.*?\.html)/gm, 'Update the JS to reference our revved partials']
                      ]
                }
            }
        }

重要的补充是模式。您需要告诉我如何在 javascript 中搜索 html 链接。

设置 assetDirs 选项也很重要,因为 usemins fileprocessor.js 通过未修改文件到修改文件的映射查找修改文件,如果 assetDirs 设置不正确,它将找不到它。