fix: should allow chaining with loaders for non-vue files (vuejs#1889)

JuniorTour · web-flow · commit f32f9538ea34 · 2021-10-26T10:27:20.000+08:00
Fixes vuejs#1879 Fixes vuejs#1883 Fixes vuejs#1890
diff --git a/src/index.ts b/src/index.ts
@@ -51,12 +51,6 @@ export default function loader(
 ) {
   const loaderContext = this
 
-  if (!/\.vue(\.html)?$/.test(loaderContext.resourcePath)) {
-    // ts-loader does some really weird stuff which causes vue-loader to
-    // somehow be applied on non-vue files... ignore them
-    return source
-  }
-
   // check if plugin is installed
   if (
     !errorEmitted &&
diff --git a/src/templateLoader.ts b/src/templateLoader.ts
@@ -16,12 +16,6 @@ const TemplateLoader: webpack.loader.Loader = function (source, inMap) {
   source = String(source)
   const loaderContext = this
 
-  if (/\.[jt]sx?$/.test(loaderContext.resourcePath)) {
-    // ts-loader does some really weird stuff which causes vue-loader to
-    // somehow be applied on non-vue files... ignore them
-    return source
-  }
-
   // although this is not the main vue-loader, we can get access to the same
   // vue-loader options because we've set an ident in the plugin and used that
   // ident to create the request for this loader in the pitcher.
diff --git a/test/fixtures/process-custom-file/custom-file.svg b/test/fixtures/process-custom-file/custom-file.svg
@@ -0,0 +1,3 @@
+<template>
+    <div>ProcessedCustomFile</div>
+</template>
diff --git a/test/fixtures/process-custom-file/process-custom-file.vue b/test/fixtures/process-custom-file/process-custom-file.vue
@@ -0,0 +1,13 @@
+<template>
+    <div>
+        <CustomFile />
+    </div>
+</template>
+<script>
+    import CustomFile from './custom-file.svg'
+    export default {
+        components: {
+            CustomFile
+        }
+    }
+</script>
diff --git a/test/template.spec.ts b/test/template.spec.ts
@@ -102,3 +102,21 @@ test('postLoaders support', async () => {
   // class="red" -> class="green"
   expect(instance.$el.className).toBe('green')
 })
+
+// #1879
+test('should allow process custom file', async () => {
+  const { instance } = await mockBundleAndRun({
+    entry: 'process-custom-file/process-custom-file.vue',
+    module: {
+      rules: [
+        {
+          test: /\.svg$/,
+          loader: 'vue-loader',
+        },
+      ],
+    },
+  })
+
+  expect(instance.$el.tagName).toBe('DIV')
+  expect(instance.$el.innerHTML).toMatch('ProcessedCustomFile')
+})
