@fastify/react 1.1.5 → 1.1.6-rc.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fastify/react",
-  "version": "1.1.5",
+  "version": "1.1.6-rc.0",
   "description": "The official @fastify/vite renderer for React",
   "keywords": [
     "fastify",
@@ -67,9 +67,8 @@
     "acorn": "^8.14.1",
     "acorn-strip-function": "^1.2.0",
     "acorn-walk": "^8.3.4",
-    "devalue": "^5.6.1",
+    "devalue": "^5.6.2",
     "history": "latest",
-    "html-rewriter-wasm": "^0.4.1",
     "minipass": "latest",
     "mlly": "^1.7.4",
     "react": "^19.2.3",
@@ -77,7 +76,7 @@
     "react-router": "^7.12.0",
     "valtio": "latest",
     "youch": "^3.3.4",
-    "@fastify/vite": "^8.4.0"
+    "@fastify/vite": "^9.0.0-rc.0"
   },
   "scripts": {}
 }

package/plugin/index.js

@@ -1,5 +1,3 @@
-import { readFileSync, existsSync } from 'node:fs'
-import { join } from 'node:path'
 import viteFastify from '@fastify/vite/plugin'
 import {
   prefix,
@@ -9,8 +7,6 @@ import {
   createPlaceholderExports,
 } from './virtual.js'
 import { closeBundle } from './preload.js'
-import { parseStateKeys } from './parsers.js'
-import { generateStores } from './stores.js'
 
 export default function viteFastifyReactPlugin({ ts } = {}) {
   const context = {

package/plugin/parsers.test.js

@@ -1,7 +1,7 @@
 import test from 'node:test'
 import assert from 'node:assert'
 
-test('parseStateKeys', (t) => {
+test('parseStateKeys', () => {
   const a = `export function state () {
     return {
       user: {

package/plugin/preload.js

@@ -1,6 +1,5 @@
 import { readFileSync, writeFileSync, mkdirSync, existsSync } from 'node:fs'
 import { join, isAbsolute, parse as parsePath } from 'node:path'
-import { HTMLRewriter } from 'html-rewriter-wasm'
 
 const imageFileRE = /\.((png)|(jpg)|(svg)|(webp)|(gif))$/
 
@@ -18,7 +17,7 @@ export async function closeBundle(resolvedBundle) {
   }
   const indexHtml = readFileSync(join(distDir, 'index.html'), 'utf8')
   const pages = Object.fromEntries(
-    Object.entries(resolvedBundle ?? {}).filter(([id, meta]) => {
+    Object.entries(resolvedBundle ?? {}).filter(([, meta]) => {
       if (meta.facadeModuleId?.includes('/pages/')) {
         meta.htmlPath = meta.facadeModuleId.replace(/.*pages\/(.*)\.(j|t)sx$/, 'html/$1.html')
         return true
@@ -44,30 +43,14 @@ export async function closeBundle(resolvedBundle) {
     for (const js of jsImports) {
       jsPreloads += `  <link rel="modulepreload" crossorigin href="${base}${js}">\n`
     }
-    const pageHtml = await appendHead(indexHtml, imagePreloads, cssPreloads, jsPreloads)
+    const pageHtml = appendHead(indexHtml, imagePreloads, cssPreloads, jsPreloads)
     writeHtml(page, pageHtml, distDir)
   }
 }
 
-async function appendHead(html, ...tags) {
-  const encoder = new TextEncoder()
-  const decoder = new TextDecoder()
-  let output = ''
-  const rewriter = new HTMLRewriter((outputChunk) => {
-    output += decoder.decode(outputChunk)
-  })
-  rewriter.on('head', {
-    element(element) {
-      element.prepend(tags.join('\n  '), { html: true })
-    },
-  })
-  try {
-    await rewriter.write(encoder.encode(html))
-    await rewriter.end()
-    return output
-  } finally {
-    rewriter.free()
-  }
+function appendHead(html, ...tags) {
+  const content = tags.join('\n  ')
+  return html.replace(/<head([^>]*)>/i, `<head$1>\n  ${content}`)
 }
 
 function writeHtml(page, pageHtml, distDir) {

package/rendering.js

@@ -75,7 +75,7 @@ async function createResponse(req, routes) {
 export async function createHtmlFunction(source, _, config) {
   // Creates `universal` and `serverOnly` sets of
   // HTML `beforeElement` and `afterElement` templates
-  const templates = await createHtmlTemplates(source, config)
+  const templates = createHtmlTemplates(source, config)
 
   // Registered as reply.html()
   return async function () {

package/routing.js

@@ -106,6 +106,7 @@ export async function createRoute({ client, errorHandler, route }, scope, config
   } else {
     const { id } = route
     const htmlPath = id.replace('pages/', 'html/').replace(/\.(j|t)sx$/, '.html')
+    // TODO: Switch to config.viteConfig once deprecated config.vite alias is removed.
     let distDir = config.vite.build.outDir
     if (!isAbsolute(config.vite.build.outDir)) {
       distDir = join(config.vite.root, distDir)

package/templating.js

@@ -1,51 +1,28 @@
 import { createHtmlTemplateFunction } from '@fastify/vite/utils'
-import { HTMLRewriter } from 'html-rewriter-wasm'
 
-export async function createHtmlTemplates(source, config) {
+const moduleScriptPattern = /<script\s[^>]*\btype\s*=\s*["']module["'][^>]*>[\s\S]*?<\/script>/gi
+
+export function createHtmlTemplates(source, config) {
   const el = '<!-- element -->'
 
   const universal = source.split(el)
-  const serverOnlyRaw = await removeClientModule(source, config)
+  const serverOnlyRaw = removeClientModule(source, config)
   const serverOnly = serverOnlyRaw.split(el)
 
   return {
     // Templates for client-only and universal rendering
     universal: {
-      beforeElement: await createHtmlTemplateFunction(universal[0]),
-      afterElement: await createHtmlTemplateFunction(universal[1]),
+      beforeElement: createHtmlTemplateFunction(universal[0]),
+      afterElement: createHtmlTemplateFunction(universal[1]),
     },
     // Templates for server-only rendering
     serverOnly: {
-      beforeElement: await createHtmlTemplateFunction(serverOnly[0]),
-      afterElement: await createHtmlTemplateFunction(serverOnly[1]),
+      beforeElement: createHtmlTemplateFunction(serverOnly[0]),
+      afterElement: createHtmlTemplateFunction(serverOnly[1]),
     },
   }
 }
 
-async function removeClientModule(html, config) {
-  const decoder = new TextDecoder()
-
-  let output = ''
-  const rewriter = new HTMLRewriter((outputChunk) => {
-    output += decoder.decode(outputChunk)
-  })
-
-  rewriter.on('script', {
-    element(element) {
-      for (const [attr, value] of element.attributes) {
-        if (attr === 'type' && value === 'module') {
-          element.replace('')
-        }
-      }
-    },
-  })
-
-  try {
-    const encoder = new TextEncoder()
-    await rewriter.write(encoder.encode(html))
-    await rewriter.end()
-    return output
-  } finally {
-    rewriter.free()
-  }
+function removeClientModule(html) {
+  return html.replace(moduleScriptPattern, '')
 }