merge changes from #500 into #502

package.json

@@ -67,8 +67,8 @@
     "@types/node": "^18.18.1",
     "eslint": "^8.50.0",
     "nuxt": "^3.11.2",
-    "vitest": "^1.3.1",
-    "typescript": "^5.4.5"
+    "typescript": "^5.4.5",
+    "vitest": "^1.3.1"
   },
   "stackblitz": {
     "installDependencies": false,

playground/components/ServerComponent.server.vue

@@ -0,0 +1,10 @@
+<template>
+  <div>
+    <h1>Server-only Nuxt-Island component</h1>
+    <p>Nonce: <span id="server-nonce">{{ nonce }}</span></p>
+  </div>
+</template>
+
+<script setup lang="ts">
+const nonce = useNonce()
+</script>

playground/pages/island.vue

@@ -0,0 +1,6 @@
+<template>
+  <div>
+    Island Page
+    <ServerComponent />
+  </div>
+</template>

src/runtime/nitro/plugins/60-recombineHtml.ts

@@ -24,11 +24,13 @@ export default defineNitroPlugin((nitroApp) => {
 
       // Let's insert the CSP meta tag just after the first tag which should be the charset meta
       let insertIndex = 0
-      const metaCharsetMatch = html.head[0].match(/^<meta charset="(.*?)">/mdi)
-      if (metaCharsetMatch && metaCharsetMatch.indices) {
-        insertIndex = metaCharsetMatch.indices[0][1]
+      if (html.head.length > 0) {
+        const metaCharsetMatch = html.head[0].match(/^<meta charset="(.*?)">/mdi)
+        if (metaCharsetMatch && metaCharsetMatch.indices) {
+          insertIndex = metaCharsetMatch.indices[0][1]
+        }
+        html.head[0] = html.head[0].slice(0, insertIndex) + `<meta http-equiv="Content-Security-Policy" content="${headerValue}">` + html.head[0].slice(insertIndex) 
       }
-      html.head[0] = html.head[0].slice(0, insertIndex) + `<meta http-equiv="Content-Security-Policy" content="${headerValue}">` + html.head[0].slice(insertIndex) 
     }
   })
 })