feat!: keep default export by default

Author: sxzz

README.md

@@ -18,7 +18,11 @@ npm i -D unplugin-vue-named-export
 import VueNamedExport from 'unplugin-vue-named-export/vite'
 
 export default defineConfig({
-  plugins: [VueNamedExport()],
+  plugins: [
+    VueNamedExport({
+      /* options */
+    }),
+  ],
 })
 ```
 
@@ -32,7 +36,11 @@ export default defineConfig({
 import VueNamedExport from 'unplugin-vue-named-export/rollup'
 
 export default {
-  plugins: [VueNamedExport()],
+  plugins: [
+    VueNamedExport({
+      /* options */
+    }),
+  ],
 }
 ```
 
@@ -46,7 +54,11 @@ export default {
 import { build } from 'esbuild'
 
 build({
-  plugins: [require('unplugin-vue-named-export/esbuild')()],
+  plugins: [
+    require('unplugin-vue-named-export/esbuild')({
+      /* options */
+    }),
+  ],
 })
 ```
 
@@ -59,21 +71,11 @@ build({
 // webpack.config.js
 module.exports = {
   /* ... */
-  plugins: [require('unplugin-vue-named-export/webpack')()],
-}
-```
-
-<br></details>
-
-<details>
-<summary>Vue CLI</summary><br>
-
-```ts
-// vue.config.js
-module.exports = {
-  configureWebpack: {
-    plugins: [require('unplugin-vue-named-export/webpack')()],
-  },
+  plugins: [
+    require('unplugin-vue-named-export/webpack')({
+      /* options */
+    }),
+  ],
 }
 ```
 
@@ -89,14 +91,41 @@ import { MyCard } from './my-card.vue'
 import { MyFooter } from './my_footer.vue'
 ```
 
+### Options
+
+```ts
+type Options = {
+  include?: string | RegExp | (string | RegExp)[]
+  exclude?: string | RegExp | (string | RegExp)[]
+
+  /**
+   * Convert filename to export name
+   * @default pascalCaseFn
+   */
+  resolveName?(id: string): string | Promise<string>
+  /**
+   * Whether to keep default export
+   * @default false
+   */
+  removeDefault?: boolean
+}
+```
+
 ### Volar
 
+Support only pascal case named export for Volar.
+
 ```jsonc
 // tsconfig.json
 {
   // ...
   "vueCompilerOptions": {
-    "plugins": ["unplugin-vue-named-export/volar"]
+    "plugins": ["unplugin-vue-named-export/volar"],
+
+    "namedExport": {
+      // defaults to false
+      "removeDefault": false
+    }
   }
 }
 ```

src/core/options.ts

@@ -1,15 +1,24 @@
-import type { BaseOptions } from '@vue-macros/common'
+import type { BaseOptions, MarkRequired } from '@vue-macros/common'
 
 export interface Options extends Pick<BaseOptions, 'include' | 'exclude'> {
+  /**
+   * Convert filename to export name
+   * @default pascalCaseFn
+   */
   resolveName?(id: string): string | Promise<string>
+  /**
+   * Whether to keep default export
+   * @default false
+   */
+  removeDefault?: boolean
 }
 
-export type OptionsResolved = Pick<Required<Options>, 'include'> &
-  Pick<Options, 'exclude' | 'resolveName'>
+export type OptionsResolved = MarkRequired<Options, 'include' | 'removeDefault'>
 
 export function resolveOption(options: Options): OptionsResolved {
   return {
     include: [/\.vue$/],
+    removeDefault: false,
     ...options,
   }
 }

src/index.ts

@@ -49,6 +49,10 @@ export default createUnplugin<Options | undefined, false>((rawOptions = {}) => {
         `export const ${resolvedName} = `
       )
 
+      if (!options.removeDefault) {
+        s.appendLeft(defaultExport.end!, `\nexport default ${resolvedName};`)
+      }
+
       return generateTransform(s, id)
     },
   }

src/volar.ts

@@ -1,18 +1,25 @@
 import { FileKind, type VueLanguagePlugin, replace } from '@vue/language-core'
 import { resolveName } from './core/utils'
 
-const plugin: VueLanguagePlugin = () => {
+const plugin: VueLanguagePlugin = ({ vueCompilerOptions }) => {
   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} = `
-      )
+      // @ts-expect-error
+      if (vueCompilerOptions.namedExport?.removeDefault)
+        replace(
+          embeddedFile.content,
+          'export default ',
+          `export const ${exportedName} = `
+        )
+      else
+        replace(embeddedFile.content, /export default .*/, (m) => {
+          const stmt = m.replace('export default ', '')
+          return `export const ${exportedName} = ${stmt}\nexport default ${exportedName}`
+        })
     },
   }
 }

tests/__snapshots__/basic.test.ts.snap

@@ -18,7 +18,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
 
 const ElCard = /* @__PURE__ */ _export_sfc(_sfc_main, [__FILE__]);
 
-export { ElCard };
+export { ElCard, ElCard as default };
 "
 `;
 
@@ -37,7 +37,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
 
 const UpperCase = /* @__PURE__ */ _export_sfc(_sfc_main, [__FILE__]);
 
-export { UpperCase };
+export { UpperCase, UpperCase as default };
 "
 `;
 
@@ -59,7 +59,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
 
 const Basic = /* @__PURE__ */ _export_sfc(_sfc_main, [__FILE__]);
 
-export { Basic };
+export { Basic, Basic as default };
 "
 `;
 
@@ -81,7 +81,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
 
 const ElButton = /* @__PURE__ */ _export_sfc(_sfc_main, [__FILE__]);
 
-export { ElButton };
+export { ElButton, ElButton as default };
 "
 `;
 
@@ -103,6 +103,6 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
 
 const MyButton = /* @__PURE__ */ _export_sfc(_sfc_main, [__FILE__]);
 
-export { MyButton };
+export { MyButton, MyButton as default };
 "
 `;

tests/fixtures/main.ts

@@ -1,4 +1,4 @@
-export { Basic } from './basic.vue'
+export { Basic, default as BasicDefault } from './basic.vue'
 export { ElCard } from './ElCard.vue'
 export { ElButton } from './el-button.vue'
 export { MyButton } from './my_button.vue'

tsconfig.json

@@ -13,7 +13,10 @@
     "skipLibCheck": true
   },
   "vueCompilerOptions": {
-    "plugins": ["./dist/volar.js"]
+    "plugins": ["./dist/volar.js"],
+    "namedExport": {
+      "removeDefault": false
+    }
   },
   "include": ["src", "tests"]
 }