VUE第一个项目怎么读懂

VUE介绍

VUE是前端开发框架。
原始的前端开发需要工程师写html、写css、写javascript(js)。js是脚本语言，浏览器可以运行js来执行一些js支持的动作，例如点击反馈，下拉菜单、操作html的DOM元素之类。这样开发效率很低。
后来诞生了一些前端开发框架，VUE就是其中之一。目前在国内前端开发，特别是手机APP的H5页面的开发中，被很多公司采用。
使用VUE开发的时候，不需要js直接操作html的DOM元素元素，只需要管理js的变量值，html会自动更新这些值（双向绑定）。少量语句就可以实现原始方式大量编码才能实现的功能。

IDE介绍

VUE开发的IDE多数用visio stdio code（VScode）。VScode本身只是编辑器，编译类语言需要自己配编译环境。
前端开发不需要配编译环境，只需要把必须的各种库、工具在VScode自带的命令行界面安装就行。具体过程网上搜“从零开始搭建vue项目”。

工程目录结构介绍

刚建立好的项目一定是下面这种目录结构（ranktable.vue是后加的，请忽略）

第一次建立工程难免会懵，啥都没写就出来这么多文件，不但数量不少，文件种类还多。
学习VUE别想一下吃的太多，除非本身前端经验丰富。否则先看懂红色箭头的几个文件吧，看懂这几个就算入门了。看的顺序严格按照下面这样。

1. index.html

2. main.js