学习Vue脚手架总结

今天学习了创建Vue脚手架、分析脚手架结构、修改默认其默认配置。首先是创建，可以到Vue官网上找到VueCLI脚手架，然后点击就可以跳转到CLI的页面，上面有详细的安装教程，因为服务器不在国内，所以下载之前先配置npm镜像，下载完之先选择创建一个文件的路径通过（vue create 文件名）创建文件后会有Vue2和Vue3供选择，因为还在学习Vue2所以选择Vue2，之后我们就可以在桌面看到创建好的文件了，Vue里面已经默认给我们写好了一个HelloWorld的项目，我们只需在刚才创建文件的路径下输入命令（npm run serve），执行完之后就已经翻译完了还会给我们开启一个8080的端口，复制这个端口地址到浏览器上就可以看到项目了。接下来就是分析一下脚手架里面的基本文件都是些什么，首先第一个就是git的忽略文件，里面配置的是不想给git管理的文件和文件夹；babel控制文件，它是用来把ES6语法转为ES5的；package文件是包的说明书，里面有包的名字、版本、依赖等等；package-lock文件，它是用来锁住包的版本控制的作用；README文件，里面是项目的说明，可以让别人更快的了解项目；App文件就是昨天说到的组件集合；main文件是入口文件，里面引入Vue和App组件还有创建Vue实例；assets文件是静态资源文件，一般放些图片图标视频资源等等；了解这些文件的作用之后就对Vue脚手架有一个大体的认知。最后提到的是Vue给我们提供了很多个版本，通过文件打开的方式查看到它们每一个版本的内存都不一样，vue.js是完整版，它由两大部分组成，分别是核心的功能和模板解析，但vue后面紧跟runtime的版本是没有模板解析的，所以不能使用template配置项，需要使用render函数接收到的createElement函数去指定具体内容，提供的版本中要看需求来选择，完整版虽然齐全但是有用不上的地方就会浪费内存，没有这个必要。