windows10下VUE的安装

  • 1.官网下载node.js
  • 2.检测node.js是否安装成功
  • 3.安装vue


安装vue之前最好先下载node.js,在用node安装vue。

1.官网下载node.js

附下载地址 http://nodejs.cn/download/

2.检测node.js是否安装成功

1.下载完安装包之后进行傻瓜式的安装就行,然后记住安装的目录。
2.安装完node.js后,是会有npm包管理器的,所以可以在node.js的安装目录进入cmd使用node -v 和npm -v 命令查看node.js是否成功安装,出现版本号说明安装成功。

vue3 如何检查axios是否安装 怎么查看vue安装位置_windows

3.安装vue

vue的安装有vue2.x的安装和vue3.x的安装,首先介绍vue2.x的安装。

1.安装vue

vue2.x

1.1在之前安装node的命令窗口输入npm install -g vue-cli 来进行安装vue

vue3 如何检查axios是否安装 怎么查看vue安装位置_命令窗口_02


vue3.x

1.2在之前安装node的命令窗口输入npm install -g @vue/cli(安装指定版本npm install -g @vue/cli@3.11.0 )来进行安装vue3.x

vue3 如何检查axios是否安装 怎么查看vue安装位置_windows_03


vue3 如何检查axios是否安装 怎么查看vue安装位置_node.js_04

2.检查vue是否安装成功,在命令窗口输入 vue -Version或者 vue -V来查看vue是否安装成功,出现如图的版本号说明已经安装成功。(我这里vue的版本跟安装的不一样是因为做过一次升级,所以大家不必在意,能出现版本号就是可以的)

vue3 如何检查axios是否安装 怎么查看vue安装位置_windows_05

这个是安装vue3.x执行vue -V之后显示的版本号

vue3 如何检查axios是否安装 怎么查看vue安装位置_命令窗口_06

至此vue的安装就成功了。

vue3.x的进阶用法——vue图形化界面

在命令窗口输入vue ui,等待执行完之后即可进入图形化页面/

命令

vue3 如何检查axios是否安装 怎么查看vue安装位置_命令窗口_07


图形化界面

vue3 如何检查axios是否安装 怎么查看vue安装位置_vue_08

选择项目路径

vue3 如何检查axios是否安装 怎么查看vue安装位置_vue_09

输入项目名,包管理器选择npm,点击下一

vue3 如何检查axios是否安装 怎么查看vue安装位置_node.js_10


点击默认配置,进行创建项目

vue3 如何检查axios是否安装 怎么查看vue安装位置_node.js_11


等待安装

vue3 如何检查axios是否安装 怎么查看vue安装位置_vue_12


命令窗口可以查看进度

vue3 如何检查axios是否安装 怎么查看vue安装位置_node.js_13


成功之后就可以看到管理页面

vue3 如何检查axios是否安装 怎么查看vue安装位置_vue3 如何检查axios是否安装_14


在项目目录中使用命令npm run serve就可以启动项目

命令窗口

vue3 如何检查axios是否安装 怎么查看vue安装位置_windows_15


网页内容

vue3 如何检查axios是否安装 怎么查看vue安装位置_windows_16


以上就是vue3.x项目的创建和运行。