在使用vue3 + vite + ant design vue 的时候，引用组件，打包会报错

rolling_257

于 2024-03-07 13:48:03 发布

阅读量929

点赞数 10

分类专栏：知识文章标签： vue.js javascript 前端 html5

本文链接：https://blog.csdn.net/m0_58133506/article/details/136531551

版权

知识专栏收录该内容

1 篇文章

订阅专栏

本文讲述了在使用Vue3、Vite和AntdVue开发时，如何解决在引入Antd组件时打包过程中出现的错误，重点在于正确导入FormItemRest组件的方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一、描述

在使用vue3 + vite + ant design vue 的时候，引入一些antd的一些组件的时候，通常运行是没有错的，但是打包会报错，例如：

 <template>
  	<FormItemRest>
  		<a-input v-moal:value='val' />
  	</FormItemRest>
  </template>
  <script lang='ts' setup>
  	import { ref } from 'vue';
    import { Form,FormItemRest} from 'ant-design-vue';
	const val = ref('');
  </script>

二、解决办法

 <template>
  	<FormItemRest>
  		<a-input v-moal:value='val' />
  	</FormItemRest>
  </template>
  <script lang='ts' setup>
  	import { ref } from 'vue';
    import { Form} from 'ant-design-vue';
	const FormItemRest = Form.ItemRest; //正解，正确使用方法
	const val = ref('');
  </script>