Console error message "xx.confirm is not a function" and not show dialog.

[iwengx]

trafficstars

• [ ] I have searched the issues of this repository and believe that this is not a duplicate.

Version

3.2.5

Environment

Vite^2.9.9、Vue^3.2.36、pnpm

Reproduction link

Steps to reproduce

1. Create a Vue project using the above environment.
2. Using Confirmation modal dialog Example
3. pnpm run build and click button.

What is expected?

Show a confirmation modal dialog.

What is actually happening?

Console error message "xx.confirm is not a function" and not show dialog.

---

In the build environment.

[github-actions[bot]]

Hello @wengx-unx. We totally like your proposal/feedback, welcome to send us a Pull Request for it. Please send your Pull Request to proper branch, fill the Pull Request Template here, provide changelog/TypeScript/documentation/test cases if needed and make sure CI passed, we will review it soon. We appreciate your effort in advance and looking forward to your contribution!

你好 @wengx-unx，我们完全同意你的提议/反馈，欢迎直接在此仓库创建一个 Pull Request 来解决这个问题。请将 Pull Request 发到正确的分支，务必填写 Pull Request 内的预设模板，提供改动所需相应的 changelog、TypeScript 定义、测试用例、文档等，并确保 CI 通过，我们会尽快进行 Review，提前感谢和期待您的贡献。

[cshuting]

Has this problem been fixed?

[iwengx]

Has this problem been fixed?

Not yet

[techbirds]

After verification, under the premise of the same environment, the pop-up window after construction can work normally. You can take a look at this example:

https://github.com/techbirds/my-vue-app

pnpm i
pnpm run serve

So please check whether your environment is normal and whether the writing method is correct.

[gitgundam]

Has this problem been fixed?

Not yet

same problem, after builded the project with vite.

[eisir]

you can try to use import Modal from "ant-design-vue/lib/modal" instead of import { Modal } from "ant-design-vue"

[lxchapu]

you can try to use import Modal from "ant-design-vue/lib/modal" instead of import { Modal } from "ant-design-vue"

it worked

[zch233]

the same

[peerlessXu]

i have the same problem

[wjkang]

the same

[asiyuan]

have any result

[asiyuan]

you can try to use import Modal from "ant-design-vue/lib/modal" instead of import { Modal } from "ant-design-vue"

so use this, can't open in development

[cn-wang]

you can try to use

// modal.ts
import { Modal } from 'ant-design-vue'
export const {  info, success, error, warning, confirm } = Modal

<!-- demo.vue -->
<template>
  <button @click="handleClick">click me</button>
</template>

<script  lang="ts">
import {confirm} from './modal'
export default {
  setup() {

    return {
      handleClick() {
       confirm({
          title: "title", 
          onOk() {
            console.log("hi...")
          }
        })
      }
    }
  }
}
</script>

I think this question should be in vite...

[dodaydream]

you can try to use

// modal.ts
import { Modal } from 'ant-design-vue'
export const {  info, success, error, warning, confirm } = Modal

<!-- demo.vue -->
<template>
  <button @click="handleClick">click me</button>
</template>

<script  lang="ts">
import {confirm} from './modal'
export default {
  setup() {

    return {
      handleClick() {
       confirm({
          title: "title", 
          onOk() {
            console.log("hi...")
          }
        })
      }
    }
  }
}
</script>

I think this question should be in vite...

Tried the above solution, still does not work. Can confirm this question occurred in vite. However, importing from ant-design-vue/lib/modal works.

[github-actions[bot]]

This issue is stale because it has been open 60 days with no activity. Remove stale label or comment or this will be closed in 7 days

[hakityc]

same problem

[thaotrong2000]

- My solution is: I use confirm modal in package "ant-design-vue". I dont import all component, i import several component.

// important import { Modal } from "ant-design-vue"; Vue.prototype.$confirm = Modal.confirm;

[thaotrong2000]

same problem My solution: https://github.com/vueComponent/ant-design-vue/issues/5763#issuecomment-1488380170

[hakityc]

Thanks! I have successed in his way (eisir )

[hakityc]

Thanks! I have successed in his way (eisir )

https://github.com/vueComponent/ant-design-vue/issues/5763#issuecomment-1177231433

[github-actions[bot]]

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.