vue cli是基于vuejs进行快速开发的完成系统,并用渐进式框架构建用户界面
具体可以去官方的文档看看vue的介绍
其中需要用到vue、nodejs、npm等等
第一步安装nodejs
nodejs 是一个开源的和跨平台的 JavaScript 运行时环境
nodejs 在浏览器外运行 Google Chrome 的内核。 这使 nodejs表现得非常出色,并且应用程序运行于单个进程中,无需为每个请求创建新的线程。
打开命令窗口如果已经安装或者安装完成node可以在命令窗口通过node -v来查看是否安装成功和安装版本号
nodejs官网地址 http://nodejs.cn/
第二步安装npm
其实npm集成就在node中直接在窗口中输入npm -v查看版本号
当然你也可以使用cnpm
通过命令行
npm install -g cnpm --registry=https://registry.npm.taobao.org
然后回车等待安装完成就行
接下来就是安装vue了在安装vue-cli3.0时如果你的电脑已经安装了全局的vue-cli的老版本需要卸载打开命令窗口输入命令行
npm uninstall vue-cli -g
等待卸载完成
卸载完成后你需要重新安装新的vue-cli包
npm install -g @vue/cli 或者 cnpm install -g @vue/cli
等待下载完成
下载完成后你就可以创建一个新的工程
当然首先你需要先进入你想创建文件的文件盘中
创建新工程的命令行为 vue create my-project-cli3.0
回车之后就会进入到这里继续回车就是进入默认的预置然后等待下载完成,当然你也可以选择手动的一般脚手架已经配置好了,你需要其他的可以后期在项目中再去修改
当然我这里也给一个手动配置的键盘的上下箭头来控制选择,default是上面说的默认配置,下面的这个就是手动的,选择中手动回车
上下为选项,空格键为选中和取消,A键为全选
TypeScript 支持使用 TypeScript书写源码
pwa 是否支持pwa
router 是否支持vue-router
vuex 是否支持vuex
css 是否支持css预处理器
linter 是否支持代码风格检查和格式化
unit Testing 是否支持单元测试
e2e Testing 是否支持e2e测试
这些东西就是选择路由是否单个存放,使用的css等等
配置完之后就是自动下载依赖什么的
到达这里说明你的工程已经加载好了可以进行启动了
然后进入项目之后输入命令行npm run serve启动项目这一点以前是npm run dev;
通过idea导入项目后就会发现3.0比2.0的少了不少的东西,webpack配置的目录没有了,还有build、config两个文件夹没有了,需要配置的话需要在vue.config.js文件中配置,并且static文件夹改为public,router文件夹变为单个文件