1. Problems
In the vue3 environment, using the ant-design 3.2.20 version of the Modal dialog plug-in, the confirm()
confirmation box quickly pops up to report an error, the local debugging is normal, and the error is reported after packaging. The packaging tool is vite.
Two, the reason
For the introduction method, the following is the introduction of the official document.
This passage in the document misunderstood me a bit. There message
is indeed no problem with the introduction of the component in the example, but modal
an error was reported after the component was packaged and launched. After checking the document several times, it was found that the introduction was normal. In the end, after thinking about it, I feel that there is still a problem with the way of introduction. It is better to have no books than to believe in books. So the introduction method was changed and the problem was successfully solved.
Three, the solution
Modify the import method.
<script setup lang='ts'>
import Modal from 'ant-design-vue/lib/modal'
</script>
main.ts
import 'ant-design-vue/es/modal/style/css'
postscript
When I finally checked the document, Ant Design of Vue
I found this sentence under the menu.
Manual import
import DatePicker from 'ant-design-vue/lib/date-picker'; // load JS
import 'ant-design-vue/lib/date-picker/style/css'; // load CSS
END