ant-design-vue样式文件报错

Question

为什么引入 ant-design-vue 的 css 文件就报错

import { createApp } from 'vue'
import App from './App.vue'
import Antd from 'ant-design-vue'
import 'ant-design-vue/dist/antd.css';

createApp(App).use(Antd).mount('#app')

Answer 1

让阿豪来帮你解答，本回答参考chatgpt3.5编写提供，如果还有疑问可以评论或留言

问题原因是因为在引入 ant-design-vue 的 css 文件时，代码中使用了分号（;）和尖括号（<>）使得代码格式混乱，并且拼接了不正确的字符串括号。正确的代码应该是：

import { createApp } from 'vue';
import App from './App.vue';
import Antd from 'ant-design-vue';
import 'ant-design-vue/dist/antd.css';
const app = createApp(App);
app.use(Antd);
app.mount('#app');

在这段代码中，首先正确引入了 vue、App 组件、ant-design-vue 以及其对应的样式文件。然后创建了一个 app 实例，并且使用了 Antd 插件。最后将 app 挂载到指定的 DOM 节点上。 通过以上改正后的代码，就能够正确引入 ant-design-vue 的 css 文件，避免报错。