Match rules with custom resource name
Also use this name as rule.issuer or splitChunks test
Show nicely in stats

cc @xtuc (holyc-loader)
cc @yyx990803 (vue-loader)
This is interesting for you.

What kind of change does this PR introduce?
feature

Did you add tests for your changes?
yes

Does this PR introduce a breaking change?
no

What needs to be documented once your changes are merged?
For loader authors:

A new inline request syntax is available. Prefixing <match-resource>!=! to a request will set the matchResource for this request. (A relative matchResource will resolve relative to the current context of the containing module.)
When a matchResource is set, it will be used to match with the module.rules instead of the original resource. This can be useful if further loaders should be applied to the resource, or if the module type need to be changed. It's also displayed in the stats and used for matching Rule.issuer and test in splitChunks.

Example: A loader extracts styles from comments in javascript files.

// file.js
/* STYLE: body { background: red; } */
console.log("yep");

A loader could transform the file into the following file and use the matchResource to apply the user-specified css processing rules:

// file.js transformed by loader
import "./file.js.css!=!extract-style-loader/getStyles!./file.js"
console.log("yep");

This will add a dependency to extract-style-loader/getStyles!./file.js and threat the result as file.js.css. Because module.rules has a rule matching /\.css$/ it will apply to this dependency.

// extract-style-loader
const stringifyRequest = require("loader-utils").stringifyRequest;
const getRemainingRequest = require("loader-utils").getRemainingRequest;
const getStylesLoader = require.resolve("./getStyle");
module.exports = function(source) {
  if(STYLES_REGEXP.test(source)) {
    source = source.replace(STYLES_REGEXP, "");
    const remReq = getRemainingRequest(this);
    return `import ${stringifyRequest(`${this.resource}.css!=!${getStylesLoader}!${remReq}`};${source}`;
  }
  return source;
}

// extract-style-loader/getStyles.js
module.exports = function(source) {
  const match = STYLES_REGEXP.match(source);
  return match[0];
}