config=>{a:1,b:2} generates weird code

[thegrandpoobah]

The documentation for imports-loader has a case for injecting a variable with a JS Object literal as follows:

import?config=>{size:50}

This works great, but once you try to add another property to this JS object in (what I considered to be) the obvious way:

import?config=>{size:50,color:2}

The imports-loader (indirectly via loaders-util) tokenizes on the comma and starts doing.. weird things (hard to describe, but it basically treats the {size:50 as a variable injection, and the color:2} as a require injection.

The solution is easy enough once you understand what is going on (or read through the source code), just replace the comma with the URI encoded version %2C. But you actually have to do this manually and can't depend on the encodeURIComponent function (something to do with require context? Not sure).

I'm guessing that this may throw a curve ball for people (like it did for me!) so it might be worthwhile to beef up the documentation to clarify this.

I'm still a bit new to webpack and all its modules and plug-ins, so I may be doing something wrong, so please do bear with me :)

[michael-ciniawsky]

@thegrandpoobah Could you provide an example please and elaborate on the loader-utilspart futher I need to triage if this is an eventual bug in loader-utils 😛