文章目录
- 1. 首先下载Node
- 2. 全局安装@vue/cli
- 3. 创建Vue项目
- 4. 启动Vue项目
1. 首先下载Node
既然都开始创建Vue项目了,想必大家电脑里面都有Node跟npm了,这里就不赘述了。
2. 全局安装@vue/cli
@vue/cli是什么
@vue/cli 是一个全局安装的 npm 包,提供了终端里的 vue 命令。例如后面的vue项目创建都需要使用到vue命令。
vue全局安装
管理员命令窗口:npm install -g @vue/cli
可能会出现的问题:ETIMEDOUT
原因:这是因为npm下载时,使用的是国外的npm源,所以网络不佳导致超时
解决:切换成国内镜像(npm config set registry http://registry.npmmirror.com),注意因为淘宝镜像在2024-01-22已经过期了,所以上述是淘宝镜像的新地址。
安装成功:通过 “vue --version” 命令,如果输出版本号则安装成功
3. 创建Vue项目
创建Vue项目
管理员命令窗口:vue create project_name(例如:vue create hello_ui)
需要配置方式
你可以选择默认的配置方式,也可以手动配置(Manually select features)
选择手动配置的同学,可以按照自己的需求配置,可以参考我这边的参数
检测vue项目创建成功
如果出现以下信息,说明创建成功。
4. 启动Vue项目
启动项目
先切换到项目文件夹:npm run serve
启动成功
浏览器访问:http://localhost:8080/