如何让grunt用户更新JS来引用我们的图像

Question

如何让grunt用户更新JS来引用我们的图像?在yeoman web应用生成器中，它只为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'
            }]
        }
    },...

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

我怎样才能写一个正确的格式，让grunt用户重写我的JS图像参考链接到正确的压缩图像?

Answer 1

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

我的userin配置是这样结束的:

    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']
    },