feat(setup-sfc): improve nuxt support of setupSFC

.changeset/silent-impalas-call.md

@@ -0,0 +1,7 @@
+---
+'@vue-macros/setup-sfc': minor
+'@vue-macros/common': minor
+'@vue-macros/nuxt': minor
+---
+
+improve nuxt support of setupSFC

packages/common/package.json

@@ -60,7 +60,7 @@
     "@babel/types": "^7.22.5",
     "@rollup/pluginutils": "^5.0.2",
     "@vue/compiler-sfc": "^3.3.4",
-    "ast-kit": "^0.9.4",
+    "ast-kit": "^0.9.5",
     "local-pkg": "^0.4.3",
     "magic-string-ast": "^0.3.0"
   },

packages/common/src/constants.ts

@@ -15,7 +15,10 @@ export const DEFINE_EMIT = 'defineEmit'
 export const REPO_ISSUE_URL = 'https://github.com/vue-macros/vue-macros/issues'
 
 export const REGEX_SRC_FILE = /\.[cm]?[jt]sx?$/
+
 export const REGEX_SETUP_SFC = /\.setup\.[cm]?[jt]sx?$/
+export const REGEX_SETUP_SFC_SUB = /\.setup\.[cm]?[jt]sx?((?!vue&).)*$/
+
 export const REGEX_VUE_SFC = /\.vue$/
 export const REGEX_VUE_SUB = /\.vue\?vue&type=script/
 export const REGEX_NODE_MODULES = /node_modules/

packages/nuxt/package.json

@@ -54,6 +54,7 @@
   "dependencies": {
     "@nuxt/kit": "^3.6.5",
     "@vue-macros/boolean-prop": "workspace:*",
+    "@vue-macros/common": "workspace:~",
     "@vue-macros/short-vmodel": "workspace:*",
     "@vue-macros/volar": "workspace:*",
     "unplugin-vue-macros": "workspace:*"

packages/nuxt/src/index.ts

@@ -9,6 +9,7 @@ import { type Options, resolveOptions } from 'unplugin-vue-macros'
 import { type Plugin } from 'vite'
 import type {} from '@nuxt/devtools'
 import { type VolarOptions } from '@vue-macros/volar'
+import { REGEX_SETUP_SFC } from '@vue-macros/common'
 
 export type VueMacrosOptions = Options & {
   booleanProp?: {} | false
@@ -103,17 +104,38 @@ export default defineNuxtModule<VueMacrosOptions>({
       vueCompilerOptions.experimentalDefinePropProposal =
         resolvedOptions.defineProp.edition || 'kevinEdition'
 
-    nuxt.options.vite.vue ||= {}
-    nuxt.options.vite.vue.include ||= [/\.vue$/]
-    if (!Array.isArray(nuxt.options.vite.vue.include))
-      nuxt.options.vite.vue.include = [nuxt.options.vite.vue.include]
-    nuxt.options.vite.vue.include.push(/\.setup\.[cm]?[jt]sx?$/)
+    const viteVue = (nuxt.options.vite.vue ||= {})
+
+    if (resolvedOptions.setupSFC) {
+      viteVue.include ||= [/\.vue$/]
+      if (!Array.isArray(viteVue.include)) viteVue.include = [viteVue.include]
+      viteVue.include.push(REGEX_SETUP_SFC)
+
+      nuxt.hook('components:extend', (components) => {
+        for (const component of components) {
+          component.pascalName = component.pascalName.replace(/Setup$/, '')
+          component.kebabName = component.kebabName.replace(/-setup$/, '')
+        }
+      })
+
+      nuxt.hook('pages:extend', (pages) => {
+        for (const page of pages) {
+          if (!page.file || !REGEX_SETUP_SFC.test(page.file)) continue
+
+          if (page.name) page.name = page.name.replace(/\.setup$/, '')
+          if (page.path)
+            page.path = page.path
+              .replace(/\/index\.setup$/, '/')
+              .replace(/\.setup$/, '')
+        }
+      })
+    }
 
     if (options.shortVmodel !== false || options.booleanProp) {
-      nuxt.options.vite.vue.template ||= {}
-      nuxt.options.vite.vue.template.compilerOptions ||= {}
-      nuxt.options.vite.vue.template.compilerOptions.nodeTransforms ||= []
-      const { nodeTransforms } = nuxt.options.vite.vue.template.compilerOptions
+      viteVue.template ||= {}
+      viteVue.template.compilerOptions ||= {}
+      viteVue.template.compilerOptions.nodeTransforms ||= []
+      const { nodeTransforms } = viteVue.template.compilerOptions
 
       if (options.shortVmodel !== false) {
         volarPlugins.push('@vue-macros/volar/short-vmodel')

packages/setup-sfc/src/index.ts

@@ -2,7 +2,7 @@ import { createUnplugin } from 'unplugin'
 import {
   type BaseOptions,
   type MarkRequired,
-  REGEX_SETUP_SFC,
+  REGEX_SETUP_SFC_SUB,
   createFilter,
   detectVueVersion,
 } from '@vue-macros/common'
@@ -14,7 +14,7 @@ export type OptionsResolved = MarkRequired<Options, 'include' | 'version'>
 function resolveOption(options: Options): OptionsResolved {
   const version = options.version || detectVueVersion()
   return {
-    include: [REGEX_SETUP_SFC],
+    include: [REGEX_SETUP_SFC_SUB],
     ...options,
     version,
   }