安装node环境
- 进入Node.js官网,下载LTS版本,启动软件,点击next,接受协议打勾,点击next,修改软件存放路径,改为D:\Program Files\nodejs,然后点击next,继续next,不需要打勾直接next,点击Install,安装成功
- 验证:
点击win+R,输入cmd,回车,在命令提示符输入node -v、
npm -v命令
此页面代表成功 - 修改全局模块以及缓存路径
在cmd窗口输入npm root -g,查看全局安装的模块所在目录。
在执行类似:npm install express [-g] (后面的可选参数-g,g代表global全局安装的意思)的安装语句时,会占C盘空间
所以在nodejs下新建node_global以及node_cache文件
打开cmd执行以下语句:npm config set prefix “D:\Program Files\nodejs\node_global”,npm config set cache “D:\Program Files\nodejs\node_cache”
- 配置环境变量
5.下载淘宝镜像,安装脚手架等等命令
在命令提示符中输入npm install express -g,npm i -g cnpm --registry=https://registry.npm.taobao.org
在运行这里的时候,一直报错
提示权限不够,后来通过这个方法解决:
在node_cache文件夹以及node_global文件夹中,鼠标右键点击属性,打开后点击安全,对四个用户或组进行编辑,把所有允许下面的框全部勾上,点击应用后确定。
// 接下来依次操作命令
//
cnpm
cnpm -v
npm info vue
npm install vue -g
npm install -g @vue/cli
vue -V
vue
npm install -g @vue/cli-service-global
vue --version
依次看运行结果:
至此所有命令全部完成,又再打开一个命令提示符
6.创建Vue项目
输入cd desktop进入桌面,创建项目,命令为:vue create 项目名
同时可以看到该项目已经在桌面上显示了
7.通过VSCODE软件输入命令打开项目
在vscode中导入创建的项目,在终端输入命令,终端可以通过点击查看-终端找到。
命令如下:npm run serve
加载后,已经出现效果网址:
CTRL+点击网址打开,实现效果如下: