From aae61341420028c9f1ff3462dcfaaf1f99a0f9c8 Mon Sep 17 00:00:00 2001
From: Steven Jimenez <stevethedev@users.noreply.github.com>
Date: Wed, 17 Mar 2021 17:32:14 -0400
Subject: [PATCH] Allow "layer" and "issuerLayer" rule properties

The "layer" and "issuerLayer" rules are useful experimental properties that are currently stripped out by the Vue Loader plugin. This change fixes that issue.

My specific use-case was to load SVG files as Vue components if they are imported into a script, but import them as URLs if I reference them in the CSS. Layers make this trivial:

```
module.exports = {
  experiments: { layers: true },
  module: {
    rules: [
      { test: /\.vue$/, loader: "vue-loader" },
      { test: /\.vue$/, resourceQuery: /type=script/, layer: "script" },
      { test: /\.[jt]s$/, layer: "script" },
      {
        test: /\.svg$/i,
        oneOf: [
          { loader: 'vue-svg-loader', issuerLayer: "script" },
          { loader: 'file-loader' },
        ],
      },
    ],
  }
};
```
---
 lib/plugin-webpack5.js | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/lib/plugin-webpack5.js b/lib/plugin-webpack5.js
index 9b156ff12..87d7f6b26 100644
--- a/lib/plugin-webpack5.js
+++ b/lib/plugin-webpack5.js
@@ -20,12 +20,14 @@ const ruleSetCompiler = new RuleSetCompiler([
   new BasicMatcherRulePlugin('realResource'),
   new BasicMatcherRulePlugin('issuer'),
   new BasicMatcherRulePlugin('compiler'),
+  new BasicMatcherRulePlugin('issuerLayer'),
   new DescriptionDataMatcherRulePlugin(),
   new BasicEffectRulePlugin('type'),
   new BasicEffectRulePlugin('sideEffects'),
   new BasicEffectRulePlugin('parser'),
   new BasicEffectRulePlugin('resolve'),
   new BasicEffectRulePlugin('generator'),
+  new BasicEffectRulePlugin('layer'),
   new UseEffectRulePlugin()
 ])