javascript - 如何让 grunt usemin 更新 JS 以引用我们更新的图像？

Question

如何让 grunt usemin 更新 JS 以引用我们更新的图像？ 从 yeoman 网络应用程序生成器，它只重写 css 和 html 的链接，但没有 js。

如果我的JS文件有一些图片需要压缩，但是不能链接怎么办:(

这是我当前的 grunt.js 部分

    useminPrepare: {
        options: {
            dest: '<%= config.dist %>'
        },
        html: ['<%= config.app %>/*.php', '<%= config.app %>/*.html']
    },

    // Performs rewrites based on rev and the useminPrepare configuration
    usemin: {
        options: {
            assetsDirs: ['<%= config.dist %>', '<%= config.dist %>/images']
        },
        html: ['<%= config.dist %>/{,*/}*.php','<%= config.dist %>/{,*/}*.html'],
        css: ['<%= config.dist %>/styles/{,*/}*.css']
    },

    // The following *-min tasks produce minified files in the dist folder
    imagemin: {
        dist: {
            files: [{
                expand: true,
                cwd: '<%= config.app %>/images',
                src: '{,*/}*.{gif,jpeg,jpg,png}',
                dest: '<%= config.dist %>/images'
            }]
        }
    },...

我以前加了js: ['<%= config.dist %>/scripts/{,*/}*.js']在 usemin:css 之后，但它给了我 Warning: Unsupported pattern: js Use --force to continue.

如何编写正确的格式让 grunt usemin 重写我的 JS 图片引用链接以正确压缩图片？

Answer 1

我设法弄明白了，答案来自这个线程 https://github.com/yeoman/grunt-usemin/issues/235#issuecomment-33266949

我的 usemin 配置最终是这样的:

    usemin: {
        options: {
            assetsDirs: ['<%= config.dist %>', '<%= config.dist %>/images', '<%= config.dist %>/styles/fonts'],
            patterns: {
                js: [
                    [/(images\/.*?\.(?:gif|jpeg|jpg|png|webp|svg))/gm, 'Update the JS to reference our revved images']
                ]
            }
        },
        html: ['<%= config.dist %>/{,*/}*.html'],
        css: ['<%= config.dist %>/styles/{,*/}*.css'],
        js: ['<%= config.dist %>/scripts/{,*/}*.js']
    },