安装Vue node 及 创建一个Vue 项目

一 下载node.js安装包

node官方网址
https://nodejs.org/en/download/

1 下载资源包,然后安装

下载资源包

2 点击以上的Run(运行),将出现如下界面,然后一直点击Next 直达安装完成

在这里插入图片描述

3 检测PATH环境变量是否配置了Node.js,点击开始=》运行=》输入"cmd" => 输入命令"path",输出如下结果

PATH=C:\oraclexe\app\oracle\product\10.2.0\server\bin;C:\Windows\system32;
C:\Windows;C:\Windows\System32\Wbem;C:\Windows\System32\WindowsPowerShell\v1.0;
c:\python32\python;C:\MinGW\bin;C:\Program Files\GTK2-Runtime\lib;
C:\Program Files\MySQL\MySQL Server 5.5\bin;C:\Program Files\nodejs;
C:\Users\rg\AppData\Roaming\npm

C:\Program Files\nodejs\ 看到有关node代表路径没有问题了

4 检测node和npm 版本 输入指令 node --version 和 npm --version

在这里插入图片描述
在这里插入图片描述

二 安装vue

1 全局安装cli脚手架工具

vue之所以好用,这个脚手架工具有很大功劳,它帮助我们创建,打包项目,就是个小助手
npm install --global vue-cli (-global 意思是全局安装 这样Vue会安装到node 的文件夹下 否则会安装到 当前目录)

全局安装 vue-cli
在这里插入图片描述
过程中可能会有些警告但是是正常的,最后输入命令
vue --version 有版本显示则脚手架安装成功

顺带一提,在最新的cli3版本中vue的cli这个脚手架工具做出了可视化的图形工具,这里给大家看看

执行命令 vue ui 就可以啦
在这里插入图片描述
下面是它图像化的样子,许多依赖,插件在这里都可以直接下载安装,非常方便
在这里插入图片描述

三 创建一个vue项目

如果下载了cli3的同学,直接在它的图形化界面就可以创建了,下面讲讲怎么用命令行创建
在这里插入图片描述

1 创建一个基于 webpack 模板的新项目

vue init webpack my-project my-project(项目文件夹名)

然后出现一堆信息的填写,填完就好了
(项目名称)
(项目描述)
(作者)…
这里值得注意的是,==should we run npm install… ==(这句话是在问是否在工程创建后就去跑 npm 安装依赖 这里面有几个选项 第一个是【是】 也可以选最后一个 稍后自己就安装依赖 即 在命令行执行npm install 命令 ),一般建议选是就好了,因为后面也会用到
在这里插入图片描述

然后安装完成
在这里插入图片描述

2 运行测试

进入文件夹 执行运行命令

cd project2

npm run dev

在这里插入图片描述

在这里插入图片描述

然后打开浏览器就可以啦

在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值