🐛 hmr

neo-hack · Sep 24, 2021 · 8c787d0 · 8c787d0
1 parent 79c3908
commit 8c787d0
Show file tree

Hide file tree

Showing 9 changed files with 21 additions and 20 deletions.
diff --git a/.eslintignore b/.eslintignore
@@ -1,3 +1,3 @@
 dist
 node_modules
-public
+public
diff --git a/scripts/prepare.ts b/scripts/prepare.ts
@@ -13,8 +13,13 @@ async function stubIndexHtml() {
   for (const view of views) {
     await fs.ensureDir(r(`extension/dist/${view}`))
     let data = await fs.readFile(r(`src/${view}/index.html`), 'utf-8')
+    console.log(data)
     data = data
       .replace('"./main.tsx"', `"http://localhost:${port}/${view}/main.tsx"`)
+      .replace(
+        /<!-- hmr -->/g,
+        `<script type="module" src="http://localhost:${port}/hmr.ts"></script>`,
+      )
       .replace('<div id="app"></div>', '<div id="app">Vite server did not start</div>')
     await fs.writeFile(r(`extension/dist/${view}/index.html`), data, 'utf-8')
     log('PRE', `stub ${view}`)

diff --git a/src/components/Logo.tsx b/src/components/Logo.tsx
@@ -0,0 +1,5 @@
+import React from 'react'
+
+export const Logo = () => {
+  return <div>logo</div>
+}
diff --git a/src/components/Logo.vue b/src/components/Logo.vue
diff --git a/src/components/README.md b/src/components/README.md
diff --git a/src/hmr.ts b/src/hmr.ts
@@ -0,0 +1,6 @@
+// @ts-nocheck
+import RefreshRuntime from '/@react-refresh'
+RefreshRuntime.injectIntoGlobalHook(window)
+window.$RefreshReg$ = () => {}
+window.$RefreshSig$ = () => (type) => type
+window.__vite_plugin_react_preamble_installed__ = true
diff --git a/src/options/index.html b/src/options/index.html
@@ -6,6 +6,7 @@
 </head>
 <body>
   <div id="app"></div>
+  <!-- hmr -->
   <script type="module" src="./main.tsx"></script>
 </body>
 </html>
diff --git a/src/popup/index.html b/src/popup/index.html
@@ -6,6 +6,7 @@
 </head>
 <body style="min-width: 100px">
   <div id="root"></div>
+  <!-- hmr -->
   <script type="module" src="./main.tsx"></script>
 </body>
 </html>
diff --git a/vite.config.ts b/vite.config.ts
@@ -1,7 +1,7 @@
 import { defineConfig, UserConfig } from 'vite'
 import AutoImport from 'unplugin-auto-import/vite'
 import WindiCSS from 'vite-plugin-windicss'
-import react from '@vitejs/plugin-react'
+import react from '@vitejs/plugin-react-refresh'
 import windiConfig from './windi.config'
 import { r, port, isDev } from './scripts/utils'
 
@@ -17,7 +17,7 @@ export const sharedConfig: UserConfig = {
   },
   plugins: [
     // bad
-    // react(),
+    react(),
     AutoImport({
       imports: [
         {
@@ -43,7 +43,6 @@ export const sharedConfig: UserConfig = {
 }
 
 export default defineConfig(({ command }) => {
-  console.log(command)
   return {
     ...sharedConfig,
     base: command === 'serve' ? `http://localhost:${port}/` : undefined,