refactor: use order/handler for transformIndexHtml (#590)

vite-pwa · Nov 4, 2023 · 18af770 · 18af770
1 parent b353ea2
commit 18af770
Show file tree

Hide file tree

Showing 2 changed files with 40 additions and 24 deletions.
diff --git a/src/plugins/build.ts b/src/plugins/build.ts
@@ -4,22 +4,30 @@ import { _generateBundle, _generateSW } from '../api'
 import type { PWAPluginContext } from '../context'
 
 export function BuildPlugin(ctx: PWAPluginContext) {
+  const transformIndexHtmlHandler = (html: string) => {
+    const { options, useImportRegister } = ctx
+    if (options.disable)
+      return html
+
+    // if virtual register is requested, do not inject.
+    if (options.injectRegister === 'auto')
+      options.injectRegister = useImportRegister ? null : 'script'
+
+    return injectServiceWorker(html, options, false)
+  }
+
   return <Plugin>{
     name: 'vite-plugin-pwa:build',
     enforce: 'post',
     apply: 'build',
     transformIndexHtml: {
-      enforce: 'post',
-      transform(html) {
-        const { options, useImportRegister } = ctx
-        if (options.disable)
-          return html
-
-        // if virtual register is requested, do not inject.
-        if (options.injectRegister === 'auto')
-          options.injectRegister = useImportRegister ? null : 'script'
-
-        return injectServiceWorker(html, options, false)
+      order: 'post',
+      handler(html) {
+        return transformIndexHtmlHandler(html)
+      },
+      enforce: 'post', // deprecated since Vite 4
+      async transform(html) { // deprecated since Vite 4
+        return transformIndexHtmlHandler(html)
       },
     },
     generateBundle(_, bundle) {

diff --git a/src/plugins/dev.ts b/src/plugins/dev.ts
@@ -27,23 +27,31 @@ export const swDevOptions = {
 }
 
 export function DevPlugin(ctx: PWAPluginContext) {
+  const transformIndexHtmlHandler = (html: string) => {
+    const { options } = ctx
+    if (options.disable || !options.manifest || !options.devOptions.enabled)
+      return html
+
+    html = injectServiceWorker(html, options, true)
+
+    return html.replace(
+      '</body>',
+        `${generateRegisterDevSW(options.base)}
+</body>`,
+    )
+  }
+
   return <Plugin>{
     name: 'vite-plugin-pwa:dev-sw',
     apply: 'serve',
     transformIndexHtml: {
-      enforce: 'post',
-      async transform(html) {
-        const { options } = ctx
-        if (options.disable || !options.manifest || !options.devOptions.enabled)
-          return html
-
-        html = injectServiceWorker(html, options, true)
-
-        return html.replace(
-          '</body>',
-            `${generateRegisterDevSW(options.base)}
-</body>`,
-        )
+      order: 'post',
+      async handler(html) {
+        return transformIndexHtmlHandler(html)
+      },
+      enforce: 'post', // deprecated since Vite 4
+      async transform(html) { // deprecated since Vite 4
+        return transformIndexHtmlHandler(html)
       },
     },
     configureServer(server) {