vue相关环境搭建一条龙
前言
如题,基于很多朋友对于环境配置及搭建存在疑问或者不熟悉的情况,因此整理一篇完整的环境搭建说明,在此默认各位到手的电脑是需要从0开始配置环境。
nvm的安装
很多同学过去可能安装node都是直接采用下载安装包,直接进行软件的安装,当然这没什么问题,但是我在这里建议使用nvm来管理node,你要问我应用场景,那可能是因为你没遇到过,多个项目所需node环境版本不一致的情况,即便是没有这种情况,使用nvm来管理node还是极为方便的,那么nvm是什么?简而言之:nvm是让你在同一台机器上安装和切换不同版本的node的工具
nvm下载地址:https://github.com/coreybutler/nvm-windows/releases
•nvm-noinstall.zip: 这个是绿色免安装版本,但是使用之前需要配置
•nvm-setup.zip:这是一个安装包,下载之后点击安装,无需配置就可以使用,方便。
•Source code(zip):zip压缩的源码
•Sourc code(tar.gz):tar.gz的源码,一般用于Linux系统
如上,此处建议选择 nvm-setup.zip 下载安装(傻瓜式安装),无需配置,解决一些朋友不会做环境配置的困扰。
安装完成后,测试安装是否成功,在控制台输入如下命令,出现版本号信息,则安装成功。
nvm --version
在此简单介绍几个nvm的常用命令,不做过多阐述
nvm list | 查看已经安装的版本 |
nvm install [arch] | 安装制定版本的node 并且可以指定平台 version 版本号 arch 平台 |
nvm uninstall | 卸载制定的版本 |
nvm use [version] [arch] | 切换制定的node版本和位数 |
nvm version | 查看当前的版本 |
node的安装 (可指定安装版本号)
nvm install 12.16.2
安装完成后,执行如下命令,出现版本号信息即为安装成功
node -v
全局vue-cli脚手架的安装(3.x)
npm install -g yarn // 安装yarn包管理工具,非必须,自行选择
注意:若电脑之前有2.x版本的脚手架,需要先进行移除,若没有安装过脚手架,可忽略
npm uninstall vue-cli -g //(若存在2.x,先移除)或者执行,yarn global remove vue-cli
安装3.x脚手架
npm install -g @vue/cli
# OR
yarn global add @vue/cli
查看是否安装成功,若出现版本号信息即为安装成功
vue -V
创建项目
vue create project-name //OR vue ui
后面则是根据需要对要创建的项目选择基础配置,此处不再过多赘述。
友情链接:
FatTiger’s Blog https://wangshenjie.com
郭永昌的博客 https://wangshenjie.com