2、vue 中 引入 ant-design-vue

1.查找资料

https://vue.ant.design/docs/vue/use-with-vue-cli-cn/

引入可以使用yarn   也可以用npm

2.动手实践

不使用上面介绍的方法了，直接在package.json中的dependencies中加入依赖（红色部分）

"dependencies": {
  "core-js": "^2.6.5",
  "vue": "^2.6.10",
  "ant-design-vue": "^1.3.16"
},

因为自己按照上面的安装有点问题，就把下载的依赖全部删掉了。

项目中cmd输入npm install ，yarn不好用，咱也不知道为啥呀（vue-cli-service里的yorkie报错）

 

其实只要在node_modules里能找到ant-design-vue的依赖就行了

修改代码：

main.js:

import Vue from 'vue'
import Button from "ant-design-vue/lib/button";
import "ant-design-vue/dist/antd.css";
import App from './App.vue'

// 目的是引入 button 组件以及antd全部的样式
Vue.component(Button.name, Button);
Vue.config.productionTip = false

new Vue({
  render: h => h(App),
}).$mount('#app')

App.vue

<template>
  <div id="app">
    <img alt="Vue logo" src="./assets/logo.png">
    <HelloWorld msg="Welcome to Your Vue.js App"/>
    <a-button type="primary">primary Button</a-button>
  </div>
</template>

这种引入的方式是我感觉是不太好用的，下面再说