Revert "fix: call transformer from whitelisted custom blocks (#310)"

This reverts commit ab13f3b.

Author: znck

package.json

@@ -46,7 +46,7 @@
     "runtime/"
   ],
   "dependencies": {
-    "@vue/component-compiler": "^4.2.0",
+    "@vue/component-compiler": "^4.1.0",
     "@vue/component-compiler-utils": "^3.0.0",
     "debug": "^4.1.1",
     "hash-sum": "^1.0.2",

src/index.ts

@@ -4,8 +4,7 @@ import {
   parseVuePartRequest,
   resolveVuePart,
   isVuePartRequest,
-  transformRequireToImport,
-  DEFAULT_LANGS
+  transformRequireToImport
 } from './utils'
 import {
   createDefaultCompiler,
@@ -184,15 +183,11 @@ export default function vue(opts: Partial<VuePluginOptions> = {}): Plugin {
   if (!opts.styleInjectorShadow)
     opts.styleInjectorShadow = '~' + require.resolve('../runtime/shadow')
 
-  const defaultLang: Record<string, string> = {
-    ...DEFAULT_LANGS,
+  createVuePartRequest.defaultLang = {
+    ...createVuePartRequest.defaultLang,
     ...opts.defaultLang
   }
 
-  if (opts.defaultLang && typeof opts.defaultLang.styles === 'string') {
-    defaultLang.style = opts.defaultLang.styles
-  }
-
   const shouldExtractCss = opts.css === false
   const customBlocks: string[] = []
 
@@ -274,10 +269,10 @@ export default function vue(opts: Partial<VuePluginOptions> = {}): Plugin {
 
     resolveId(id, importer) {
       const request = id
-
-      if (!importer) return
+      
+      if (!importer) return 
       if (!isVuePartRequest(id)) return
-
+      
       id = path.resolve(path.dirname(importer), id)
       const ref = parseVuePartRequest(id)
 
@@ -312,12 +307,7 @@ export default function vue(opts: Partial<VuePluginOptions> = {}): Plugin {
       let map = element.map as any
 
       if (request.meta.type === 'styles') {
-        code = prependStyle(
-          id,
-          request.meta.lang || defaultLang.style,
-          code,
-          map
-        ).code
+        code = prependStyle(id, request.meta.lang, code, map).code
       }
 
       dL(`id: ${id}\ncode: \n${code}\nmap: ${JSON.stringify(map, null, 2)}\n\n`)
@@ -354,7 +344,7 @@ export default function vue(opts: Partial<VuePluginOptions> = {}): Plugin {
             if (style.content) {
               style.content = prependStyle(
                 filename,
-                style.lang || defaultLang.style,
+                style.lang || 'css',
                 style.content,
                 style.map
               ).code
@@ -398,12 +388,12 @@ export default function vue(opts: Partial<VuePluginOptions> = {}): Plugin {
               code: `
             export * from '${createVuePartRequest(
               filename,
-              descriptor.script.lang || defaultLang.script,
+              descriptor.script.lang || 'js',
               'script'
             )}'
             import script from '${createVuePartRequest(
               filename,
-              descriptor.script.lang || defaultLang.script,
+              descriptor.script.lang || 'js',
               'script'
             )}'
             export default script
@@ -443,23 +433,22 @@ export default function vue(opts: Partial<VuePluginOptions> = {}): Plugin {
             .filter(Boolean)
         }
 
-        // Why?
         input.script.code = input.script.code.replace(/^\s+/gm, '')
 
         const result = assemble(compiler, filename, beforeAssemble(input), opts)
 
         descriptor.customBlocks.forEach((block, index) => {
           if (!isAllowed(block.type)) return
-          const lang =
-            typeof block.attrs.lang === 'string'
-              ? block.attrs.lang
-              : defaultLang[block.type] || block.type
-          const id = createVuePartRequest(filename, lang, block.type, index)
           result.code +=
             '\n' +
-            `export * from '${id}'\n` +
-            `import __custom_block_${index}__ from '${id}'\n` +
-            `__custom_block_${index}__(__vue_component__)`
+            `export * from '${createVuePartRequest(
+              filename,
+              (typeof block.attrs.lang === 'string' && block.attrs.lang) ||
+                createVuePartRequest.defaultLang[block.type] ||
+                block.type,
+              'customBlocks',
+              index
+            )}'`
         })
 
         dT(

src/utils.ts

@@ -21,6 +21,14 @@ export interface VuePartRequestMeta {
   index?: number
 }
 
+export interface VuePartRequestCreator {
+  (filename: string, lang: string, type: string, index?: number): string
+
+  defaultLang: {
+    [key: string]: string
+  }
+}
+
 export function createVueFilter(
   include: Array<string | RegExp> | string | RegExp = [/\.vue$/i],
   exclude: Array<string | RegExp> | string | RegExp = []
@@ -41,11 +49,7 @@ export function getVueMetaFromQuery(id: string): VuePartRequestMeta | null {
         ? (query[PARAM_NAME] as any)[0]
         : query[PARAM_NAME]) as string
 
-      let [type, index, lang] = data.split('.')
-
-      if (!/^(template|styles|script)$/i.test(type)) {
-        type = 'customBlocks'
-      }
+      const [type, index, lang] = data.split('.')
 
       return (lang
         ? { type, lang, index: parseInt(index) } // styles.0.css
@@ -60,13 +64,13 @@ export function isVuePartRequest(id: string): boolean {
   return getVueMetaFromQuery(id) !== null
 }
 
-export function createVuePartRequest(
+export const createVuePartRequest: VuePartRequestCreator = ((
   filename: string,
   lang: string | undefined,
   type: string,
   index?: number
-): string {
-  lang = DEFAULT_LANGS[type] || lang
+): string => {
+  lang = lang || createVuePartRequest.defaultLang[type]
 
   const match = GET_QUERY.exec(filename)
 
@@ -77,14 +81,12 @@ export function createVuePartRequest(
     .join('.')
 
   return `${path.basename(filename)}?${queryString.stringify(query)}`
-}
+}) as VuePartRequestCreator
 
-export const DEFAULT_LANGS: Record<string, string> = {
+createVuePartRequest.defaultLang = {
   template: 'html',
-  style: 'css',
-  script: 'js',
-  docs: 'md',
-  i18n: 'json'
+  styles: 'css',
+  script: 'js'
 }
 
 export function parseVuePartRequest(id: string): VuePartRequest | undefined {

test/options/__snapshots__/custom-blocks.spec.ts.snap

@@ -1,16 +1,6 @@
 import vue, { VuePluginOptions } from '../../src'
 import { pluginInline } from '../setup/plugins'
 import { rollup } from 'rollup'
-function pluginText() {
-  return {
-    name: 'text',
-    transform(source: string, id: string) {
-      if (/\.(md|txt)$/.test(id)) {
-        return `export default ${JSON.stringify(source.trim())}`
-      }
-    },
-  }
-}
 
 describe('customBlocks', () => {
   async function setup(options?: Partial<VuePluginOptions>) {
@@ -31,16 +21,11 @@ describe('customBlocks', () => {
         </docs>
       `
         ),
-        pluginText(),
         vue({
           ...options,
-          defaultLang: {
-            docs: 'md',
-            custom: 'txt',
-          },
-          normalizer: 'vue-runtime-helpers/dist/normalize-component.mjs',
-        }),
-      ],
+          normalizer: 'vue-runtime-helpers/dist/normalize-component.mjs'
+        })
+      ]
     })
       .then(bundle => bundle.generate({ format: 'es' }))
       .then(generated => generated.output[0])
@@ -55,15 +40,15 @@ describe('customBlocks', () => {
 
   it('array of tags', async () => {
     const { code } = await setup({
-      customBlocks: ['custom'],
+      customBlocks: ['custom']
     })
 
     expect(code).toEqual(expect.stringContaining('My Custom Block'))
     expect(code).not.toEqual(expect.stringContaining('My Docs Block'))
   })
   it('negative array of tags', async () => {
     const { code } = await setup({
-      customBlocks: ['*', '!custom'],
+      customBlocks: ['*', '!custom']
     })
 
     expect(code).not.toEqual(expect.stringContaining('My Custom Block'))
@@ -73,19 +58,10 @@ describe('customBlocks', () => {
     const { code } = await setup({
       customBlocks(tag) {
         return tag === 'custom'
-      },
+      }
     })
 
     expect(code).toEqual(expect.stringContaining('My Custom Block'))
     expect(code).not.toEqual(expect.stringContaining('My Docs Block'))
   })
-
-  it('transform', async () => {
-    const { code } = await setup({
-      customBlocks: ['docs'],
-    })
-
-    expect(code).toEqual(expect.stringContaining('__custom_block_1__(__vue_component__)'))
-    expect(code).toMatchSnapshot()
-  })
 })

test/options/custom-blocks.spec.ts

@@ -1571,10 +1571,10 @@
     source-map "~0.6.1"
     vue-template-es2015-compiler "^1.9.0"
 
-"@vue/component-compiler@^4.2.0":
-  version "4.2.0"
-  resolved "https://registry.yarnpkg.com/@vue/component-compiler/-/component-compiler-4.2.0.tgz#437855cd59f3d713a4eef81bac7ab0f4950977b4"
-  integrity sha512-bxFNxUpKzLfHDoGTsAe2w7gEz4OwII7tp5m7sAXES1DApbpYglH4YSpYxdZRZ4GN/wj2fPD0u72QRJXd4UPvFQ==
+"@vue/component-compiler@^4.1.0":
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/@vue/component-compiler/-/component-compiler-4.1.0.tgz#92ccb90e425aa7e61d58bf092a5cfcdd6d0f9315"
+  integrity sha512-20S7mm7CYP94m2Morw2ftz1tqoBu1nX7KYiqo5rlgKPZ0dlY7VZX7wAL/etN3s4HD0PBeenr1pUUCBIgGSaB2g==
   dependencies:
     "@vue/component-compiler-utils" "^3.0.0"
     clean-css "^4.1.11"