1、使用vue-cli 3搭建vue项目

1.查询资料

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

2.自己动手

我自己电脑已经安装过npm, yarn, vue-cli 所以就不教如何安装这些东西了

vue create 自己项目的名称，不一定就是官网说的那种

等着它完成就可以了

3.查看项目结构

ps:箭头所指的地方是在cmd(项目路径下)中 执行的命令： npm run serve 允许，npm run build 打包

1.public 文件夹内是存放一些不需要被打包的静态文件（理解可能有误，欢迎指正）这个文件内的东西，不会被打包到dist里

2.src 文件夹内是会被打包的内容

3.assets 资源目录 assets 用于组织未编译的静态资源如 LESS、SASS 或 JavaScript。

4.components 存放组件

4.运行项目

5、代码分析

首先看public中的index.html

第一个框框是项目的ico图标

第二个框框是项目的标题

第三个框框是项目的入口

main.js中 将App.vue组件实例绑定到了上面的第三个框框内（这样解释不知道对不对可以自行百度其中的代码，欢迎指正）

App.vue就是个组件了，由img和HelloWorld组件组成。可以向HelloWorld组件传msg

HelloWorld.vue,可以接收上图传的msg，展示到对应使用的地方

所以就有了开始的那个运行结果的页面了，可以自己尝试修改一下 App.vue中传的msg看效果