【Vue】脚手架搭建

搭建vue脚手架

一、安装Node.js

1、Node.js简介

简单的说 Node.js 就是运行在服务端的 JavaScript。

Node.js 是一个基于 Chrome JavaScript 运行时建立的一个平台。

Node.js 是一个事件驱动 I/O 服务端 JavaScript 环境，基于 Google 的 V8 引擎，V8 引擎执行 Javascript 的速度非常快，性能非常好。

2、下载Node.js

打开官网下载链接:https://nodejs.org/en/download/

下载完成后就可以开始安装了，只需无脑下一步就行，不过记得修改自己安装的路径

至此Node.js已经安装完成，可以先进行下简单的测试安装是否成功了，后面还要进行环境配置
在键盘按下【win+R】键，输入cmd，然后回车，打开cmd窗口

node -v 

能够显示版本号就说明已经安装成功了

安装完后的目录如下图所示:

环境配置

我希望将全模块所在路径和缓存路径放在我node.js安装的文件夹中，则在我安装的文件夹【D:\Develop\nodejs】下创建两个文件夹【node_global】及【node_cache】如下图

创建完两个空文件夹之后，打开cmd命令窗口，输入

npm config set prefix"D:\Develop\nodejs\node_global"

npm config set cache "D:\Develop\nodejs\node_cache"

接下来设置环境变量，关闭cmd窗口，“我的电脑”-右键-“属性”-“高级系统设置”-“高级”-“环境变量”

进入环境变量对话框，在【系统变量】下新建【NODE_PATH】

【D:\Develop\nodejs】 此处为自己的安装的路径

然后编辑path，新建，为%NODE_PATH%

此时Node就已经安装成功了！！！

二、配置淘宝镜像

打开 “命令提示符” 窗口，输入：

npm config set registry https://registry.npm.taobao.org

完成配置

三、安装脚手架

打开 “命令提示符” 窗口，输入：

npm install -g @vue/cli

注意：如果安装过程一直不动，可以敲下回车

检查是否安装成功： vue -V 或者 vue --version

三、 创建一个vue项目

• cd到自己想要保存的路径 cd 路径

• 在要创建工程的目录下输入 ：vue create 项目名

回车安装即可

安装完成之后 ，将文件拖入到vscode或者其他编译器，在左侧能够看到创建的资源

Ctrl + ~ 打开终端

输入一下代码，启动

npm run serve

此时就可以看到页面了