最近项目需要,使用vue.3.0 使用 vue-cli 4.5.4 以及 antd 2.0 搭建一个项目,antd 2.0 目前处于测试版,我把过程总结一下。
antd 2.0 的地址 :https://2x.antdv.com/components/radio-cn/
vue3.0 的地址: https://www.vue3js.cn/docs/zh/guide/migration/introduction.html#vue-cli
vue路由模式 :hash(#) history
vue-cli 得搭建:
vue-cli 命令方法跟以前有点区别,vue3.0 需要vue-cli 得版本在4.5以上才能支持,使用 npm 或者cnpm 安装都可以,为了安装速度,建议cnpm.
cnpm 安装方法,就不介绍了。 安装vue-cli得命令行为:
npm install -g @vue/cli@next
安装成功后,可以查看一下版本,命令行为
@vue/cli -V (大写V)
然后可以找一个磁盘,打开本地的cmd得命令框,使用 命令 :
vue create <项目名字>
创建一个项目,然后按照对应提示进行vue3.0的创建,如图:
装完之后,文件里面文件目录,如下:
文件相比之前稍微简化了很多。
然后根据需要安装需要的依赖,因为我们全局引入antd,所以我就直接cnpm 安装了 antd,less, less-loader, 按需引入的可以看文档,基本上差不多把,
npm i --save ant-design-vue@next
npm i --save less
cnpm 也是一样。
然后打开自己的vue项目进行一些配置。主要是main.js 入口文件:
之前配置的有问题,会老是报 antd 未定义的问题。
按需引入的话,
这里也需要注意一下,style:css 不是为 true.
增加默认创建项目,加入了js严格模式,eslint,导致有空格也会报错,解决方法如下
删除,重启即可。