Grunt usemin and useminPrepare multiple targets

Question

From the usemin issues it appears that usemin and useminPrepare support multiple targets in the latest version:

Support multiple targets in useminPrepare:

• pull#162

• pull#206

usemin support:

• Multiple targets

I've tried using multiple targets with the following configuration:

useminPrepare: {
    foo: {
        dest: 'fooDist',
        src: ['foo/index.html']
    },
    bar: {
        dest: 'barDist',
        src: ['bar/index.html']
    }
},
usemin: {
    foo: {
        options: {
            assetsDirs : ['fooDist']
        },
        html: ['fooDist/**/*.html'],
        css: ['fooDist/styles/**/*.css']
    },
    bar: {
        options: {
            assetsDirs : ['barDist']
        },
        html: ['barDist/**/*.html'],
        css: ['barDist/styles/**/*.css']
    }
},

but I receive the following error:

Running "usemin:foo" (usemin) task Warning: Unsupported pattern: foo

Use --force to continue.

Using grunt-usemin 2.0.2

foo/index.html and bar/index.html being the main pages for 2 single page applications.

Thanks for your help!

Answer 1

by default usemin tries to detect parser type (html,css) from the target name. when you are using a target that it's name is not a valid parser type you should use the type option to specify the parser type manually. this will result in two target for every dest, one for html and one for css.

usemin:{
    'foo-html':
    {
       options:
       {
           assetsDirs : ['fooDist'],
           type:'html'
       },
       files: {src: ['fooDist/**/*.html']}
    },
    'foo-css':
    {
        options:
        {
            assetsDirs : ['fooDist'],
            type:'css'
        },
        files: {src: ['fooDist/styles/**/*.css']}
    },
    'bar-html':
    {
        options:
        {
            assetsDirs : ['barDist'],
            type:'html'
        },
        files: {src: ['barDist/**/*.html']}
    },
    'bar-css':
    {
        options:
        {
            assetsDirs : ['barDist'],
            type:'css'
        },
        files: {src: ['barDist/styles/**/*.css']}
    }
}

https://github.com/yeoman/grunt-usemin/issues/255