开发环境:nodejs , 包管理工具npm或者yarn,git管理工具tower或者小乌龟。(去对应的官网去下载)
开发工具:vscode
第一步:通过Vue UI 新建项目。
在终端输入 vue -ui
![](https://img.haomeiwen.com/i1372178/a994f26b3ca0c772.png)
我们点击左上角的Vueui 下拉选择 Vue项目管理器
![](https://img.haomeiwen.com/i1372178/ca5967d19479dd33.png)
选择新建项目
![](https://img.haomeiwen.com/i1372178/f0a9fed76cf96c83.png)
选择项目所在的目录创建项目 输入项目名称以及包管理器
![](https://img.haomeiwen.com/i1372178/a59897e8d8467334.png)
点击下一步,会提供Vue 给你提供的模板,我们可以选择他们给我们提供的模板,我们也可以自己搭配设置,我选择手动设置
![](https://img.haomeiwen.com/i1372178/9182844b15b1a771.png)
下面我们选择我们需要的配置
![](https://img.haomeiwen.com/i1372178/760528e685e237ce.png)
大概讲一下我们选择的配置。
1.选择Vue的版本
2.babel babel是解析es6及以上版本js写法的工具,用于让各种浏览器可以识别es代码的工具。这个是需要的。
3.TS TS是js的超集,实现了许多js种没有功能 这个是vue3.0刚推出来的配置项,这个我们先不做配置。
4.pwa 是用于移动端app模拟一些原生功能,比如通知推送,这个也先不用
5.router vueX 都是Vue全家桶的东西 在项目中需要
6.css CSS预处理器用一种专门的编程语言,进行Web页面样式设计,然后再编译成正常的CSS文件。和一般的js有一点区别,但是结构化做的很好,很简洁。需要。
![](https://img.haomeiwen.com/i1372178/5b6c34784606e7f7.png)
7.linter 用于页面格式化,可以根据自己定义的规则格式化页面,让多人开发减少页面格式 二引发的冲突。
8 单元测试 es2测试 这个先不管
9.使用配置文件,让项目中各自的配置文件分离开来。用
![](https://img.haomeiwen.com/i1372178/c81fe3996c1f639e.png)
下一步 点击 创建项目 一个新的项目就创建好了
网友评论