一、脚手架创建的vue项目基础结构
未安装路由和vuex
二、public
public文件夹：放置静态资源（图片），webpack在打包时会原封不动的打包到dist文件夹中
三、src文件夹（程序员源代码文件夹）
-
assets文件夹：放置静态资源（多个组件共用的静态资源），在webpack打包时会把静态资 源当成模块打包到JS文件中
-
components：放置非路由组件（全局组件），公共组件
-
APP.vue：唯一的根组件
-
main.js：程序入口文件，整个程序中最先执行的文件
四、.browserslistrc配置
在使用脚手架搭建项目时，会自动生成.browserslistrc文件，该文件只要是 配置兼容浏览器
对于部分配置参数做一些解释:
" >1%" :代表着全球超过1%人使用的浏览器
“last 2 versions” : 表示所有浏览器兼容到最后两个版本
“not ie <=8” :表示IE浏览器版本大于8（实则用npx browserslist 跑出来不包含IE9 ）
“safari >=7”:表示safari浏览器版本大于等于7
五、.gitignore的用法
Git忽略文件.gitignore详解
在工程中，并不是所有文件都需要保存到版本库中的，例如“target”目录及目录下的文件就可以忽略。在Git工作区的根目录下创建一个特殊的.gitignore文件，然后把要忽略的文件名填进去，Git就会自动忽略这些文件或目录。
规则：
* 空格不匹配任意文件，可作为分隔符，可用反斜杠转义
* 开头的文件标识注释，可以使用反斜杠进行转义
* ! 开头的模式标识否定，该文件将会再次被包含，如果排除了该文件的父级目录，则使用 ! 也不会再次被包含。可以使用反斜杠进行转义
* / 结束的模式只匹配文件夹以及在该文件夹路径下的内容，但是不匹配该文件
* / 开始的模式匹配项目跟目录
* 如果一个模式不包含斜杠，则它匹配相对于当前 .gitignore 文件路径的内容，如果该模式不在 .gitignore 文件中，则相对于项目根目录
* ** 匹配多级目录，可在开始，中间，结束
* ? 通用匹配单个字符
* * 通用匹配零个或多个字符
* [] 通用匹配单个字符列表
实例：
bin/: 忽略当前路径下的bin文件夹，该文件夹下的所有内容都会被忽略，不忽略 bin 文件
/bin: 忽略根目录下的bin文件
/*.c: 忽略 cat.c，不忽略 build/cat.c
debug/*.obj: 忽略 debug/io.obj，不忽略 debug/common/io.obj 和 tools/debug/io.obj
**/foo: 忽略/foo, a/foo, a/b/foo等
a/**/b: 忽略a/b, a/x/b, a/x/y/b等
!/bin/run.sh: 不忽略 bin 目录下的 run.sh 文件
*.log: 忽略所有 .log 文件
config.php: 忽略当前路径的 config.php 文件
六、babel.config.js配置文件详解
1. Babel 相当于一个中介，
一边是用户，另一边是浏览器。这几年，JavaScript 发生了很大的变化，许多新特性在很多浏览器里都不支持。
Babel 的主要作用就是规避这些问题，可以确保 JavaScript 代码兼容所有的浏览器，比如 IE 11。
2. Babel 的工作原理
Babel 使用 AST 把不兼容的代码编译成 ES15 版本，因为大多数浏览器都支持这个版本的 JavaScript 代码。
七、jsconfig.json
{
"compilerOptions": {
"baseUrl": ".",
"paths": {
// 解决项目中使用@作为路径别名，导致vscode无法跳转文件的问题
"@/*": ["src/*"]
},
// 解决prettier对于装饰器语法的警告
"experimentalDecorators": true,
// 解决.jsx文件无法快速跳转的问题
"jsx": "preserve"
},
//提高 IDE 性能
"exclude": ["node_modules", "dist", "build"]
}
exclude 为什么 提高 编译器 性能 ？
如果开发的项目根目录下没有 jsconfig.json，在默认情况下，像 VS Code， 默认不会把 node_modules文件夹排除掉。
官方给出建议是这样的：
只要有可能，您应该使用不属于项目源代码的JavaScript文件排除文件夹。
意思就是 与开发无关的文件可以让 IDE 全部在编译时排除掉，像上面的配置中就排除了，构建过程依赖文件（node_modules）和生成的文件(dist 目录) 排除这些文件，可以提高 vscode 的性能。。
八、package.json与package-lock.json
package.json
记录当前项目所依赖模块的版本信息，更新模块时锁定模块的大版本号（版本号的第一位）,不能锁定后面的小版本，
package-lock.json
package-lock.json 是在 npm install时候生成一份文件。记录了node_modules目录下所有模块（包）的名称、版本号、下载地址、及这个模块又依赖了哪些依赖。
两者区别：
npm5以前
npm5以前，没有package-lock.json这个文件。package.json文件会记录你项目中所需要的所有模块。当你执行npm install的时候，node会先从package.json文件中读取所有dependencies信息，然后根据dependencies中的信息与node_modules中的模块进行对比，没有的直接下载，已有的检查更新。
因为package.json只能锁定模块的大版本号（版本号的第一位），不能锁定后面的小版本，所以你每次重新npm install时候拉取的都是该大版本下面最新的版本。一般我们为了稳定性考虑我们不能随意升级依赖包，因为如果换包导致兼容性bug出现很难排查，这样很容易出现问题，所以package-lock.json就是来解决包锁定不升级问题的
另外，package.json文件只记录你通过npm install方式安装的模块信息，而这些模块所依赖的其他子模块的信息不会记录。
react和vue的比较
相同 1）vitual dom 2）组件化 3）props，单一数据流
不同点 1）react是jsx和模板；（jsx可以进行更多的js逻辑和操作） 2）状态管理（react） 3）对象属性（vue） 4）vue：view——medol之间双向绑定 5）vue：组件之间的通信（props，callback，emit）
