fix(dev-only): split regex

nuxt · May 14, 2023 · 9db2f8d · 9db2f8d
1 parent d077c10
commit 9db2f8d
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 2 deletions.
diff --git a/docs/2.guide/2.directory-structure/1.components.md b/docs/2.guide/2.directory-structure/1.components.md
@@ -338,6 +338,7 @@ The content will not be included in production builds and tree-shaken.
       <LazyDebugBar />
 
       <!-- if you ever require to have a replacement during production -->
+      <!-- be sure to test these using `nuxt preview` -->
       <template #fallback>
         <div><!-- empty div for flex.justify-between --></div>
       </template>

diff --git a/packages/nuxt/src/core/plugins/dev-only.ts b/packages/nuxt/src/core/plugins/dev-only.ts
@@ -9,7 +9,8 @@ interface DevOnlyPluginOptions {
 }
 
 export const DevOnlyPlugin = createUnplugin((options: DevOnlyPluginOptions) => {
-  const DEVONLY_COMP_RE = /<(?:dev-only|DevOnly)>[^<]*(?:<template\s+#fallback>(?<fallback>[\s\S]*?)<\/template>)?[\s\S]*?<\/(?:dev-only|DevOnly)>/g
+  const DEVONLY_COMP_RE = /<(?:dev-only|DevOnly)>[\s\S]*?<\/(?:dev-only|DevOnly)>/g
+  const FALLBACK_SLOT_RE = /<template\s+#fallback>(?<fallback>[\s\S]*?)<\/template>/
 
   return {
     name: 'nuxt:server-devonly:transform',
@@ -29,7 +30,8 @@ export const DevOnlyPlugin = createUnplugin((options: DevOnlyPluginOptions) => {
       const s = new MagicString(code)
       const strippedCode = stripLiteral(code)
       for (const match of strippedCode.matchAll(DEVONLY_COMP_RE) || []) {
-        s.overwrite(match.index!, match.index! + match[0].length, match.groups?.fallback || '')
+        const replacement = match[0].match(FALLBACK_SLOT_RE)?.groups?.fallback || ''
+        s.overwrite(match.index!, match.index! + match[0].length, replacement)
       }
 
       if (s.hasChanged()) {