Vue环境安装、创建项目

Vue环境安装

下载安装 node.js

node.js 是一个 js 运行环境，Vue 工程需要建立在 node.js 的基础上。

npm 是 node.js 的包管理器，npm（node package manager）

通过 npm 完成一些环境的安装

https://nodejs.org/en/download/

下载 LTS 版，长期维护的。

下载之后直接安装。

安装成功之后，如何检测是否成功？

node -v

配置环境变量

找到你的 node.js 安装路径，新建两个文件夹 “node_global”、“node_cache”

在 CMD 中输⼊命令

npm config set prefix "D:\project\vue\nodeJS\node_global"
npm config set cache "D:\project\vue\nodeJS\node_cache"

在我的电脑—》高级环境配置–〉设置环境变量

NODE_PATH = D:\project\vue\nodeJS
PATH =%NODE_PATH%\;%NODE_PATH%\node_modules;%NODE_PATH%\node_global;

npm 安装淘宝镜像

CMD 执行

npm install -g cnpm --registry=https://registry.npm.taobao.org

淘宝镜像安装失败可以执行如下命令

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

npm 安装 Vue

CMD 执行

cnpm install -g @vue/cli
npm install -g @vue/cli

安装成功之后，如何检测是否成功？

vue -V

Vue 安装失败原因

1、检查环境变量，nodejs 的根目录也要配置到 path 中

2、执行命令

npm install -g vue
npm install -g @vue/cli

3、npm config list 查看一下npm 的配置信息,下图

然后找到这个红色线里面的路径，看看有没有vue.cmd的文件，添加到环境变量中

或者直接进入改路径，运行 vue -V/vue ui 进行操作。

4、如果 vue ui 报错，在环境变量 path 中添加

C:\Windows\System32

在线创建工程

vue ui

将创建好的工程导入 IDEA，如果启动报错。

修改 IDEA 配置，重启 IDEA 即可。

创建Vue工程

1、打开终端，命令行

sudo vue ui

打开UI界面