前言

  在自己的项目开发和学习过程中使用Vue是十分频繁的,所以就把学习的过程写在这里方便查看。另外,还是声明,最好的参考文档一定是官方的文档。下面给两个官方文档的连接,有什么问题可以到里面字寻找。
Vue官方文档
Ant Design of Vue官方文档

实现

其实这个实现还是比较简单的,由于一开始并没有理解官方文档中的意思,所以配置错误导致配置没有生效,现在就直接把这个方法写在这里,下次可以进行参考,首先我的项目是Vue-cli3使用了babel。

只需要改写vue.config.js中的一个css的属性,代码如下:

css: {
loaderOptions: {
less: {
modifyVars: {
'primary-color': '#FF99CC',
'link-color': '#FF99CC',
'border-radius-base': '2px',
},
javascriptEnabled: true,
},
},
},

这时候应该是没有生效的,需要更改main.js中的import 'ant-design-vue/dist/antd.css'改为这样:

import 'ant-design-vue/dist/antd.less'

重新编译,应该就可以实现了。