学习内容
⊙ 脚手架的介绍
⊙ 脚手架2.x的创建
⊙ 脚手架3.x的创建
⊙ 脚手架3修改配置文件
脚手架的介绍
安装:
npm i -g @vue/cli
安装完以后,如果我们还想用脚手架2功能,就要拉取2.x的模板
npm i -g@vue/cli -init
vue脚手架2初始化项目:
vue init webpack my-project
现在初始化一个2.x版本的项目
这时候会有很多选项要我们确定
我的设置
然后就自动帮我们生成好文件
真的很强大,直接帮我们都配置好了,webpack的噩梦结束了hhh
脚手架3.x的创建
创建项目:
vue create 项目名称
依旧是有很多东西让我们选
之前我们在脚手架2运行时是用的npm run dev,现在脚手架3用的是npm run serve,可以在package.json里面找到
跑一下试试看:
来看看main.js
这里的template没有了,变成了render,总之就是使用render更轻量一点,小了6kb,把组件放进去就OK了,这里的mount和el的用法其实也是一样的,只是多了一层判断而已
脚手架3修改配置
之前看了脚手架2和3的区别,3的设计原则是"0配置",所以我们该怎么修改配置呢?
vue ui
我们在下载vue/cli的时候他就给我们下载了一个叫vue ui的东西,可以在本地服务上管理配置
只要在终端敲下vue ui即可
会自动帮我们打开浏览器
然后导入我们的vuecli3这个项目:
但是这个有点卡...
点击配置
还可以直接在上面运行
通过配置文件修改
进入这个文件就可以看到很多配置了
如果我们还是想自己写一些配置,可以修改文件vue.config.js,到时它会将这个文件和原来的配置进行合并
这章写的不多,因为我想给vue-router写一章,因为他们每一章都比较重要,所以分开写