vite + vuejs 3 在 mount() 处获取 vue 实例

Posted 2023-02-23

【中文标题】vite + vuejs 3 在 mount() 处获取 vue 实例

【英文标题】：vite + vuejs 3 Get vue instance at mount()

【发布时间】：2021-12-17 22:29:30

【问题描述】：

我遇到了一些奇怪的事情。

当我使用 vue-cli 获取 vue 实例时。我得到了一个带有 $ store、$ router 等的代理。但是使用 'vite' 我得到了一个代理的代理，我无法从中找到 $ store 等。

 let app = createApp(App)
  .use(store)
  .use(router)
  .mount("#app");

console.log(app);

来自基于 vue-cli 的应用程序：

来自基于 vite 的应用程序：

有谁知道如何启动实例？我错过了什么吗？

提前致谢。 =]

【参考方案1】：

App.vue 已使用脚本设置编写。默认情况下，从此类组件定义创建的组件实例将具有封闭的公共接口。

并且 createApp(App).mount() 返回从 App.vue 创建的实例 如果你写 App.vue 没有你会发现它有 $store 等。

并且，您可以使用 defineExpose() 显式公开各个 API。示例：

import  useStore  from 'vuex'

const store = useStore()
defineExpose(
  $store: store
)

如果您在 App.vue 中这样做，您现在会发现记录的对象具有 $store 属性