diff --git a/designer-demo/src/main.js b/designer-demo/src/main.js
index aefabf5e5..19d563cb0 100644
--- a/designer-demo/src/main.js
+++ b/designer-demo/src/main.js
@@ -13,13 +13,8 @@
 // 导入@opentiny/tiny-engine时，内部的依赖包也会逐个导入，可能会执行useComplie，此时需要templateHashMap。所以需要先执行一次defineEntry
 import { registry } from './defineEntry.js'
 import { init } from '@opentiny/tiny-engine'
-import { initHook, HOOK_NAME } from '@opentiny/tiny-engine-entry'
 import { configurators } from './configurators/'
 import 'virtual:svg-icons-register'
 import '@opentiny/tiny-engine-theme'
 
-const beforeAppCreate = () => {
-  initHook(HOOK_NAME.useEnv, import.meta.env)
-}
-
-init({ registry, configurators, lifeCycles: { beforeAppCreate } })
+init({ registry, configurators })
diff --git a/packages/controller/src/components/useModal.jsx b/packages/common/component/Modal.jsx
similarity index 76%
rename from packages/controller/src/components/useModal.jsx
rename to packages/common/component/Modal.jsx
index 3c0b0bf8c..8e350e416 100644
--- a/packages/controller/src/components/useModal.jsx
+++ b/packages/common/component/Modal.jsx
@@ -9,9 +9,7 @@ const confirm = ({ title, status, message, exec, cancel, showFooter = true }) =>
     message: () => {
       return (
         <div class="modal-content">
-          <div class="wrap">
-            {typeof message === 'string' ? message : <message />}
-          </div>
+          <div class="wrap">{typeof message === 'string' ? message : <message />}</div>
         </div>
       )
     }
@@ -32,11 +30,9 @@ const message = ({ title, status, message, exec, width = '400' }) => {
     width: width,
     message() {
       return (
-        <div div class="modal-content" >
-          <div class="wrap">
-            {typeof message === 'string' ? message : <message />}
-          </div>
-        </div >
+        <div div class="modal-content">
+          <div class="wrap">{typeof message === 'string' ? message : <message />}</div>
+        </div>
       )
     }
   }).then(() => {
@@ -67,10 +63,8 @@ const topbox = (options) => {
 window.topbox = topbox
 window.message = message
 
-export default () => {
-  return {
-    confirm,
-    message,
-    topbox
-  }
+export default {
+  confirm,
+  message,
+  topbox
 }
diff --git a/packages/controller/src/components/useNotify.jsx b/packages/common/component/Notify.jsx
similarity index 100%
rename from packages/controller/src/components/useNotify.jsx
rename to packages/common/component/Notify.jsx
diff --git a/packages/common/index.js b/packages/common/index.js
index 2ec8e3848..9eb8d18fd 100644
--- a/packages/common/index.js
+++ b/packages/common/index.js
@@ -213,3 +213,6 @@ export {
   MetaTableColumns,
   SearchEmpty
 }
+
+export { default as Modal } from './component/Modal'
+export { default as Notify } from './component/Notify'
\ No newline at end of file
diff --git a/packages/controller/js/http.js b/packages/controller/js/http.js
index 16cf2d162..b24c88652 100644
--- a/packages/controller/js/http.js
+++ b/packages/controller/js/http.js
@@ -11,10 +11,9 @@
  */
 
 import { useHttp } from '@opentiny/tiny-engine-http'
-import useNotify from '../src/components/useNotify'
 import { isVsCodeEnv } from './environments'
 import { generateRouter, generatePage } from './vscodeGenerateFile'
-import { usePage, useCanvas } from '@opentiny/tiny-engine-entry'
+import { usePage, useCanvas, useNotify } from '@opentiny/tiny-engine-entry'
 
 const http = useHttp()
 
diff --git a/packages/controller/src/hooks/useDataSource.js b/packages/controller/src/hooks/useDataSource.js
index ff138c0c0..3bc67b0ff 100644
--- a/packages/controller/src/hooks/useDataSource.js
+++ b/packages/controller/src/hooks/useDataSource.js
@@ -14,8 +14,7 @@ import { reactive } from 'vue'
 import { utils } from '@opentiny/tiny-engine-utils'
 import { isEqual } from '@opentiny/vue-renderless/common/object'
 import { isEmptyObject } from '@opentiny/vue-renderless/common/type'
-import useModal from '../components/useModal'
-import { HOOK_NAME, initHook } from '@opentiny/tiny-engine-entry'
+import { HOOK_NAME, initHook, useModal } from '@opentiny/tiny-engine-entry'
 
 const dataSourceState = reactive({
   dataSource: {},
diff --git a/packages/controller/src/hooks/useEditorInfo.js b/packages/controller/src/hooks/useEditorInfo.js
index 5a856bf20..6aaf02a7e 100644
--- a/packages/controller/src/hooks/useEditorInfo.js
+++ b/packages/controller/src/hooks/useEditorInfo.js
@@ -12,8 +12,7 @@
 
 import { ref } from 'vue'
 import { useHttp } from '@opentiny/tiny-engine-http'
-import useModal from '../components/useModal'
-import { HOOK_NAME, initHook } from '@opentiny/tiny-engine-entry'
+import { HOOK_NAME, initHook, useModal } from '@opentiny/tiny-engine-entry'
 
 // web版获取配置信息: 从url中获取
 const _getWebData = () => {
diff --git a/packages/controller/src/hooks/useResource.js b/packages/controller/src/hooks/useResource.js
index 08b006f7e..15e013890 100644
--- a/packages/controller/src/hooks/useResource.js
+++ b/packages/controller/src/hooks/useResource.js
@@ -14,10 +14,10 @@ import { reactive } from 'vue'
 import { useHttp } from '@opentiny/tiny-engine-http'
 import { utils, constants } from '@opentiny/tiny-engine-utils'
 import { meta as BuiltinComponentMaterials } from '@opentiny/tiny-engine-builtin-component'
-import { getMergeMeta } from '@opentiny/tiny-engine-entry'
 import { getCanvasStatus } from '../../js/canvas'
-import useNotify from '../components/useNotify'
 import {
+  getMergeMeta,
+  useNotify,
   HOOK_NAME,
   initHook,
   useApp,
diff --git a/packages/controller/src/index.js b/packages/controller/src/index.js
index 077010f8b..1809e4dc8 100644
--- a/packages/controller/src/index.js
+++ b/packages/controller/src/index.js
@@ -16,10 +16,6 @@ import useData from './useData'
 export { default as metaData } from '../meta'
 import example from './example'
 
-// 后续移入common包components
-import useNotify from './components/useNotify'
-import useModal from './components/useModal'
-
 export const getExample = example
 
 export {
@@ -38,7 +34,9 @@ export {
   useBreadcrumb,
   useProperty,
   useHelp,
+  useModal,
+  useNotify,
   useCustom
 } from '@opentiny/tiny-engine-entry'
 
-export { useNotify, useData, useMessage, useModal }
+export { useData, useMessage }
diff --git a/packages/design-core/src/init.js b/packages/design-core/src/init.js
index 516e87ef5..cf59c1b76 100644
--- a/packages/design-core/src/init.js
+++ b/packages/design-core/src/init.js
@@ -14,11 +14,11 @@ import { createApp } from 'vue'
 import initSvgs from '@opentiny/tiny-engine-svgs'
 import i18n from '@opentiny/tiny-engine-controller/js/i18n'
 import { initMonitor } from '@opentiny/tiny-engine-controller/js/monitor'
-import { injectGlobalComponents } from '@opentiny/tiny-engine-common'
+import { injectGlobalComponents, Modal, Notify } from '@opentiny/tiny-engine-common'
 import { initHttp } from '@opentiny/tiny-engine-http'
 import TinyThemeTool from '@opentiny/vue-theme/theme-tool'
 import { tinySmbTheme } from '@opentiny/vue-theme/theme' // SMB 主题
-import { defineEntry, mergeRegistry } from '@opentiny/tiny-engine-entry'
+import { defineEntry, mergeRegistry, initHook, HOOK_NAME } from '@opentiny/tiny-engine-entry'
 import App from './layout/App.vue'
 import defaultRegistry from '../registry.js'
 import { registerConfigurators } from './registerConfigurators'
@@ -35,6 +35,10 @@ const defaultLifeCycles = {
     // 在common层注入合并后的注册表
     defineEntry(newRegistry)
 
+    initHook(HOOK_NAME.useEnv, import.meta.env)
+    initHook(HOOK_NAME.useNotify, () => Notify)
+    initHook(HOOK_NAME.useModal, () => Modal)
+
     // 加载主题样式，尽早加载
     // import(`./theme/${newRegistry.config.theme}.js`)
 
diff --git a/packages/entry/src/hooks.js b/packages/entry/src/hooks.js
index d163a4fdd..560ffc328 100644
--- a/packages/entry/src/hooks.js
+++ b/packages/entry/src/hooks.js
@@ -16,6 +16,8 @@ export const HOOK_NAME = {
   useHelp: 'help',
   useHttp: 'http',
   useEnv: 'env',
+  useModal: 'modal',
+  useNotify: 'notify',
   useCustom: 'custom'
 }
 
@@ -37,6 +39,8 @@ const hooksState = {
   [HOOK_NAME.useHelp]: {},
   [HOOK_NAME.useHttp]: {},
   [HOOK_NAME.useEnv]: {},
+  [HOOK_NAME.useNotify]: {},
+  [HOOK_NAME.useModal]: {},
   [HOOK_NAME.useCustom]: {} // 自定义
 }
 
@@ -57,6 +61,8 @@ export const useProperty = () => hooksState[HOOK_NAME.useProperty]
 export const useHelp = () => hooksState[HOOK_NAME.useHelp]
 export const useHttp = () => hooksState[HOOK_NAME.useHttp]
 export const useEnv = () => hooksState[HOOK_NAME.useEnv]
+export const useModal = () => hooksState[HOOK_NAME.useModal]
+export const useNotify = () => hooksState[HOOK_NAME.useNotify]
 export const useCustom = () => hooksState[HOOK_NAME.useCustom]
 
 export function initHook(hookName, hookContent, { useDefaultExport } = {}) {