Fix can not autoload in production mode bug

src/components/Playground/Output/Preview/index.tsx

@@ -1,4 +1,3 @@
-import { useUpdatedEffect } from '@/util/hooks'
 import '@/components/Playground/Output/Preview/preview.scss'
 import { IFiles, IImportMap } from '@/components/Playground/shared'
 import Compiler from '@/components/Playground/compiler'
@@ -52,7 +51,7 @@ const Preview = ({ iframeKey, files, importMap }: PreviewProps) => {
         }
     }
 
-    useUpdatedEffect(() => {
+    useEffect(() => {
         window.addEventListener('message', handleMessage)
 
         return () => {
@@ -60,7 +59,7 @@ const Preview = ({ iframeKey, files, importMap }: PreviewProps) => {
         }
     }, [])
 
-    useUpdatedEffect(() => {
+    useEffect(() => {
         Compiler.compile(files, importMap)
             .then((result) => {
                 if (loaded) {
@@ -70,7 +69,7 @@ const Preview = ({ iframeKey, files, importMap }: PreviewProps) => {
                     } as IMessage)
                 }
             })
-            .catch((e) => {
+            .catch((e: Error) => {
                 setErrorMsg(`编译失败：${e.message}`)
             })
     }, [files, Compiler, loaded])

src/components/Playground/Output/Preview/preview.scss

@@ -1,6 +1,7 @@
 [data-component=playground-preview] {
   display: flex;
   position: relative;
+
   iframe {
     border: none;
     flex: 1;

src/components/Playground/Output/Transform/index.tsx

@@ -1,7 +1,6 @@
 import MonacoEditor from '@monaco-editor/react'
 import { Loader } from 'esbuild-wasm'
 import '@/components/Playground/Output/Transform/transform.scss'
-import { useUpdatedEffect } from '@/util/hooks'
 import { IFile, ITheme } from '@/components/Playground/shared'
 import { cssToJs, jsonToJs, addReactImport } from '@/components/Playground/files'
 import Compiler from '@/components/Playground/compiler'
@@ -32,7 +31,7 @@ const Transform = ({ file, theme }: OutputProps) => {
             })
     }
 
-    useUpdatedEffect(() => {
+    useEffect(() => {
         if (file) {
             try {
                 const code = file.value

src/components/Playground/index.tsx

@@ -1,5 +1,4 @@
 import '@/components/Playground/playground.scss'
-import { useUpdatedEffect } from '@/util/hooks'
 import { IFiles, IImportMap, ITsconfig } from '@/components/Playground/shared'
 import {
     IMPORT_MAP_FILE_NAME,
@@ -54,7 +53,7 @@ const Playground = ({ initFiles, initImportMapRaw, initTsconfigRaw }: Playground
         setFiles(files)
     }
 
-    useUpdatedEffect(() => {
+    useEffect(() => {
         try {
             setImportMap(JSON.parse(importMapRaw) as IImportMap)
         } catch (e) {
@@ -62,7 +61,7 @@ const Playground = ({ initFiles, initImportMapRaw, initTsconfigRaw }: Playground
         }
     }, [importMapRaw])
 
-    useUpdatedEffect(() => {
+    useEffect(() => {
         try {
             setTsconfig(JSON.parse(tsconfigRaw) as ITsconfig)
         } catch (e) {
@@ -76,12 +75,12 @@ const Playground = ({ initFiles, initImportMapRaw, initTsconfigRaw }: Playground
                 tsconfig={tsconfig}
                 files={{
                     ...files,
-                    'import-map.json': {
+                    [IMPORT_MAP_FILE_NAME]: {
                         name: IMPORT_MAP_FILE_NAME,
                         language: 'json',
                         value: importMapRaw
                     },
-                    'tsconfig.json': {
+                    [TS_CONFIG_FILE_NAME]: {
                         name: TS_CONFIG_FILE_NAME,
                         language: 'json',
                         value: tsconfigRaw

src/components/common/Sidebar/Footer.tsx

@@ -1,7 +1,6 @@
 import Icon from '@ant-design/icons'
 import { COLOR_ERROR } from '@/constants/common.constants'
 import { getRedirectUrl } from '@/util/route'
-import { useUpdatedEffect } from '@/util/hooks'
 import { getAvatar, getLoginStatus, getNickname, removeToken } from '@/util/auth'
 import { r_auth_logout } from '@/services/auth'
 
@@ -42,7 +41,7 @@ const Footer = () => {
 
     const loginStatus = getLoginStatus()
 
-    useUpdatedEffect(() => {
+    useEffect(() => {
         if (getLoginStatus()) {
             void getNickname().then((nickname) => {
                 setNickname(nickname)