图片路径在 html 文件中被替换，但在 js 文件中不被替换

Question

我是 Grunt 的新手，所有任务都请耐心等待。我正在开发一个 AngularJS 应用程序，我最初是通过 Yeoman 创建的。由于有很多视图，我认为将所有视图包含在模板缓存中是个好主意。所以我安装了 html2js 并根据他们的 GitHub 阅读进行了配置。它工作得几乎完美，除了一件事。我的模板包含对本地图像的一些引用。当运行grunt build 时，所有这些图像的名称都被revfile 更改。查看包含所有模板的dist/views 文件夹，我可以看到路径是正确的（路径已替换为新路径）。但是，这些对路径的更改并没有进入 html2js 生成的 js 文件。

如何让 Grunt 也正确替换生成的 html2js js 文件中的路径？这是我认为相关的 grunt initConfig 部分

filerev: {
    dist: {
        src: [
            '<%= yeoman.dist %>/scripts/{,*/}*.js',
            '<%= yeoman.dist %>/styles/{,*/}*.css',
            '<%= yeoman.dist %>/images/{,*/}*.{png,jpg,jpeg,gif,webp,svg}',
            '<%= yeoman.dist %>/styles/fonts/*'
        ]
    }
},

useminPrepare: {
    html: '<%= yeoman.app %>/index.html',
    options: {
        dest: '<%= yeoman.dist %>',
        flow: {
            html: {
                steps: {
                    js: ['concat', 'uglifyjs'],
                    css: ['cssmin']
                },
                post: {}
            }
        }
    }
},

// Performs rewrites based on filerev and the useminPrepare configuration
usemin: {
    html: ['<%= yeoman.dist %>/{,*/}*.html'],
    css: ['<%= yeoman.dist %>/styles/{,*/}*.css'],
    options: {
        assetsDirs: ['<%= yeoman.dist %>', '<%= yeoman.dist %>/images']
    }
},
****************************
grunt.registerTask('build', [
    'clean:dist',
    'wiredep',
    'useminPrepare',
    'concurrent:dist',
    'autoprefixer',
    'html2js:main',
    'concat',
    'ngAnnotate',
    'copy:dist',
    'cdnify',
    'cssmin',
    'uglify',
    'filerev',
    'usemin',
    'htmlmin'
]);

Answer 1

我可以建议您改用grunt-angular-templates 吗？它旨在将视图插入$templateCache。

相对路径我从来没有遇到过任何问题。

您甚至可以将它与https://github.com/mgcrea/grunt-nginclude 配对以内联“partials”。