feat: volar plugin

Author: sxzz

package.json

@@ -47,6 +47,10 @@
       "require": "./dist/esbuild.js",
       "import": "./dist/esbuild.mjs"
     },
+    "./volar": {
+      "require": "./dist/volar.js",
+      "import": "./dist/volar.mjs"
+    },
     "./*": "./*"
   },
   "typesVersions": {
@@ -79,6 +83,7 @@
     "@sxzz/prettier-config": "^1.0.4",
     "@types/node": "^20.8.4",
     "@vue-macros/test-utils": "^1.1.3",
+    "@vue/language-core": "^1.8.19",
     "bumpp": "^9.2.0",
     "change-case": "^5.0.2",
     "eslint": "^8.51.0",

pnpm-lock.yaml

@@ -0,0 +1,6 @@
+import path from 'node:path'
+import { camelCase } from 'change-case'
+
+export function resolveName(id: string) {
+  return camelCase(path.basename(id, 'vue'))
+}

src/core/utils.ts

@@ -1,6 +1,4 @@
-import path from 'node:path'
 import { createUnplugin } from 'unplugin'
-import { camelCase } from 'change-case'
 import {
   MagicStringBase,
   babelParse,
@@ -9,12 +7,9 @@ import {
   getLang,
 } from '@vue-macros/common'
 import { type Options, resolveOption } from './core/options'
+import { resolveName } from './core/utils'
 import type { ExportDefaultDeclaration, Node } from '@babel/types'
 
-function resolveName(id: string) {
-  return camelCase(path.basename(id, 'vue'))
-}
-
 function getNodeStart(node: Node) {
   if (node.leadingComments && node.leadingComments.length > 0) {
     return node.leadingComments[0].start!

src/index.ts

@@ -0,0 +1,21 @@
+import { FileKind, type VueLanguagePlugin, replace } from '@vue/language-core'
+import { resolveName } from './core/utils'
+
+const plugin: VueLanguagePlugin = () => {
+  return {
+    name: 'vue-named-export',
+    version: 1,
+    resolveEmbeddedFile(fileName, sfc, embeddedFile) {
+      if (embeddedFile.kind !== FileKind.TypeScriptHostFile) return
+      const exportedName = resolveName(fileName)
+      replace(
+        embeddedFile.content,
+        'export default ',
+        `export const ${exportedName} = `
+      )
+    },
+  }
+}
+
+// eslint-disable-next-line import/no-default-export
+export default plugin

src/volar.ts

@@ -0,0 +1,3 @@
+<script setup lang="ts">
+console.log('UPPER-CASE')
+</script>

tests/fixtures/UPPER-CASE.vue

@@ -0,0 +1,5 @@
+export { basic } from './basic.vue'
+export { elCard } from './ElCard.vue'
+export { elButton } from './el-button.vue'
+export { myButton } from './my_button.vue'
+export { upperCase } from './UPPER-CASE.vue'

tests/fixtures/main.ts

@@ -12,6 +12,8 @@
     "esModuleInterop": true,
     "skipLibCheck": true
   },
-  "include": ["src", "tests"],
-  "exclude": ["tests/fixtures"]
+  "vueCompilerOptions": {
+    "plugins": ["./dist/volar.js"]
+  },
+  "include": ["src", "tests"]
 }