vue2.0脚手架使用antdesignUI

秃头的男人

于 2024-05-27 17:27:12 发布

阅读量401

点赞数 3

文章标签：前端 javascript 开发语言

本文链接：https://blog.youkuaiyun.com/m0_62173626/article/details/139243481

版权

第一步安装ant-design 这里需要指定antd-vue的版本号

npm i --save ant-design-vue@1.7.8

在main.js中引入

import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import Button from 'ant-design-vue/lib/button';
import 'ant-design-vue/dist/antd.css';
Vue.use(Button)
Vue.config.productionTip = false

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

使用

<template>
  <div id="app">
    <a-button type="primary">Button></a-button>
  </div>
</template>

全局引用不然每使用一个组件都要引用一下非常麻烦

import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
//import Button from 'ant-design-vue/lib/button';  删除
import Antd from 'ant-design-vue';   //增加
import 'ant-design-vue/dist/antd.css';
Vue.use(Antd)  //Vue.use(Button)修改
Vue.config.productionTip = false

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