一 Vue框架项目实战整理：3、Vue项目执行流程分析 _流程

目录
一、前言
二、回顾项目启动
三、执行流程分析
1、打开项目
2、执行流程分析
一、前言
上两篇讲了Vue框架项目实战整理：1、开发工具介绍、快速启动Vue和Vue框架项目实战整理：2、Vue环境搭建，今天应该到Vue项目执行流程分析的时候了，为什么会有这方便的研究呢？因为接触开发也将近7年了，根据编程经验当时的想法是整个项目的执行流程都清晰了，到时候如果有机会自己搭建Vue项目架构就会得心应手、独挡一面了，毕竟语言是相通的......好了，绕的有点远开始干货。。。
二、回顾项目启动
指定项目目录
cd 项目路径，
如：cd/Users//////
【一Vue框架项目实战整理：3、Vue项目执行流程分析】

文章插图
启动项目
npm run dev
文件下面的目录：
命令行界面：
显示效果界面：
三、执行流程分析 1、打开项目
首先把项目用工具 Text 或Code、idea 打开展示
2、执行流程分析

文章插图
项目创建成功，启动后会在浏览器中打开，接下来我们来分析下它的执行流程
（1）进入页面首先加载index.html
（2）main.js文件中给id="app"的div创建一个Vue的实例
（3）这个Vue的实例，Vue在调用方法时，会传入一个函数作为参数，
也就是这里的h的实参是函数，然后会以App为参数进行调用。
然后跳转到App.vue
（3）跳转到App.vue进行加载，然后显示页面