diff --git a/image.tsx b/image.tsx
index 78c6b79..32dd085 100644
--- a/image.tsx
+++ b/image.tsx
@@ -1,8 +1,9 @@
 import React from 'react'
 import { Picture } from 'yunzai/utils'
-import { PropsType } from './views/hello.tsx'
-import { createDynamic } from 'yunzai/utils'
-const require = createDynamic(import.meta.url)
+import { type PropsType } from './views/hello.tsx'
+import { createDynamicComponent } from 'yunzai/utils'
+const dynamic = createDynamicComponent(import.meta.url)
+
 export class Image extends Picture {
   constructor() {
     super()
@@ -16,10 +17,8 @@ export class Image extends Picture {
    * @returns
    */
   async createHello(uid: number, Props: PropsType) {
-    // 非生产环境将触发 动态组件效果
-    const Hello = (
-      await require('./views/hello.tsx', process.env.NODE_ENV != 'production')
-    ).default
+    // 非生产环境将触发动态组件效果
+    const { default: Hello } = (await dynamic<'default', PropsType>('./views/hello.tsx'))
     // 生成 html 地址 或 html字符串
     const Address = this.Com.create(<Hello {...Props} />, {
       // html/hello/uid.html
@@ -29,5 +28,6 @@ export class Image extends Picture {
     return this.Pup.render(Address)
   }
 }
+
 // 初始化 图片生成对象
-export const imgae = new Image()
+export const imgae = new Image()
\ No newline at end of file
diff --git a/routes.tsx b/routes.tsx
index 1f2cabb..6ad8e60 100644
--- a/routes.tsx
+++ b/routes.tsx
@@ -1,9 +1,9 @@
 import React from 'react'
 import { movies } from './data'
 import { createDynamic } from 'yunzai/utils'
-const require = createDynamic(import.meta.url)
-const Hello = (await require('./views/hello.tsx')).default
-const Music = (await require('./views/music.tsx')).default
+const dynamic = createDynamic(import.meta.url)
+const Hello = (await dynamic('./views/hello.tsx')).default
+const Music = (await dynamic('./views/music.tsx')).default
 const Config = [
   {
     url: '/hello',