fix: hide ext appending behind a flag (ref #1372)

Author: yyx990803

lib/index.js

@@ -72,7 +72,12 @@ module.exports = function (source) {
   // e.g. foo.vue?type=template&id=xxxxx
   // and we will return early
   if (incomingQuery.type) {
-    return selectBlock(descriptor, loaderContext, incomingQuery)
+    return selectBlock(
+      descriptor,
+      loaderContext,
+      incomingQuery,
+      !!options.appendExtension
+    )
   }
 
   // module id for scoped CSS & hot-reload

lib/select.js

@@ -1,7 +1,14 @@
-module.exports = function selectBlock (descriptor, loaderContext, query) {
+module.exports = function selectBlock (
+  descriptor,
+  loaderContext,
+  query,
+  appendExtension
+) {
   // template
   if (query.type === `template`) {
-    loaderContext.resourcePath += '.' + (descriptor.template.lang || 'html')
+    if (appendExtension) {
+      loaderContext.resourcePath += '.' + (descriptor.template.lang || 'html')
+    }
     loaderContext.callback(
       null,
       descriptor.template.content,
@@ -12,7 +19,9 @@ module.exports = function selectBlock (descriptor, loaderContext, query) {
 
   // script
   if (query.type === `script`) {
-    loaderContext.resourcePath += '.' + (descriptor.script.lang || 'js')
+    if (appendExtension) {
+      loaderContext.resourcePath += '.' + (descriptor.script.lang || 'js')
+    }
     loaderContext.callback(
       null,
       descriptor.script.content,
@@ -24,7 +33,9 @@ module.exports = function selectBlock (descriptor, loaderContext, query) {
   // styles
   if (query.type === `style` && query.index != null) {
     const style = descriptor.styles[query.index]
-    loaderContext.resourcePath += '.' + (style.lang || 'css')
+    if (appendExtension) {
+      loaderContext.resourcePath += '.' + (style.lang || 'css')
+    }
     loaderContext.callback(
       null,
       style.content,

test/style.spec.js

@@ -179,6 +179,6 @@ test('CSS Modules', async () => {
   // custom ident
   await testWithIdent(
     '[path][name]---[local]---[hash:base64:5]',
-    /css-modules-vue---red---\w{5}/
+    /css-modules---red---\w{5}/
   )
 })