Javascript 使用Grunt html2js和concat，如何从concat js文件引用html文件

我有一个非常大的模块化AngularJS应用程序。我将Grunt设置为使用html2js从多个html文件创建一个JS文件

    html2js: {
        options: {
            base: 'dol',
            module: 'dol.templates',
            singleModule: true,
            useStrict: true,
            htmlmin: {
                collapseBooleanAttributes: true,
                collapseWhitespace: true,
                removeAttributeQuotes: true,
                removeComments: true,
                removeEmptyAttributes: true,
                removeRedundantAttributes: true,
                removeScriptTypeAttributes: true,
                removeStyleLinkTypeAttributes: true
            }
        },
        main: {
            src: ['app/modules/reporting/views/*.html'],
            dest: 'tmp/templates.js'
        }
    },

然后，我在所有js文件和新创建的templates.js文件上运行concat：

    concat: {
        options: {
            separator: ';'
        },

        dist: {
            src: ['tmp/*.js', 'app/app.js', 'app/app.controller.js', 'app/common/directives/directives.js', 'app/app.factory.js', 'app/modules/reporting/controllers/reports.controller.js', 'app/modules/reporting/reports.routes.js', 'app/xenon.custom.js'],
            dest: 'dist/app.js'
        }
    },

我现在有一个包含所有js文件和html文件的文件：app.js

我正在index.html中引用dist/app.js文件

我遇到的问题是在我的应用程序中，我引用了一些HTML文件，如：

// Layout Related Directives
directive('reportsSummary', function () {
    return {
        restrict: 'E',
        templateUrl: appHelper.templatePath('modules/reporting/views/reportssummary.view')
    };
}).
directive('reportsSidebarMenu', function () {
    return {
        restrict: 'E',
        templateUrl: appHelper.templatePath('modules/reporting/views/reports.sidebar.menu')
    };
}).
directive('reportsFooter', function () {
    return {
        restrict: 'E',
        templateUrl: appHelper.templatePath('modules/reporting/views/reports.footer')
    };
});

当我运行部署的应用程序时，我收到一个错误，说明它找不到这些文件。当我在本地运行我的应用程序时，它运行良好，因为文件位于正确的路径中

问题是：部署应用程序时，如何在代码中引用这些html文件，因为它们现在位于dist/app.js中

我还引用了我的ui路由器中的html文件： （功能（）{ "严格使用",

angular
    .module('dol')
    .config(reportsConfig);

reportsConfig.$inject = ['$stateProvider', '$urlRouterProvider'];

function reportsConfig($stateProvider, $urlRouterProvider) {
    $urlRouterProvider.otherwise('/reports');

    $stateProvider.state('reports',
        {
            url: '/reports',
            templateUrl: 'app/modules/reportspage/views/reports.view.html',
            controller: 'reportsController'
        });
}

---

})（）

尝试在grunt任务中使用ngtemplates：

---

您尝试过吗？我不想缓存模板。此外，如果我将它们合并到一个.js文件中，我的ui路由器将如何从新创建的app.js文件中访问该html文件？我的ui路由器使用此相对路径查找html文件：templateUrl:'app/modules/reportspage/views/reports.view.html'现在，我的所有html都合并到dist/app.js文件中的一个文件中，我的ui路由器如何知道相对于指定的相对路径在dist/app.js文件中查找？当我在本地运行它时，html文件都存在，但是当我在部署时合并html文件时，我使用dist/app.js。你为什么不想缓存模板？模板缓存本质上说是“如果您正在查找

app/modules/reportspage/views/reports.view.html

，它就在这里”，并返回html页面的主体。