vue3安装配置

1、下载node.js安装

        访问：https://www.nodejs.com.cn/

        下载安装，可以修改安装路径，一路next，直到完成

1.1、验证安装

命令：

  node -v   ：查看nodejs的版本

  npm -v    ：查看npm的版本

1.2、配置目录

重新配置npm的缓存目录和全局目录

查看命令：

         npm config get prefix ：查看npm全局安装保存路径

         npm config get cache：查看npm安装缓存cache路径

配置命令：

        配置完成后在nodejs下将出现这俩文件夹

    npm config set prefix ‘D:\Dev Files\DevTools\nodejs\node_global’

    npm config set cache ‘D:\Dev Files\DevTools\nodejs\node_cache’

重新查看：

1.3、配置npm镜像：

查看： npm config get registry

配置：npm config set registry https://registry.npmmirror.com

1.4、安装cnpm

命令：npm config set registry https://registry.npmmirror.com

安装完成后执行：cnpm -v

如果报错cnpm : 无法加载文件 D:\Dev Files\DevTools\nodejs\node_global\cnpm.ps1，因为在此系统上禁止运行脚本。

解决方法：

        打开管理员cmd输入：set-ExecutionPolicy RemoteSigned

        查看设置：get-ExecutionPolicy

        重新执行：cnpm -v

1.5、配置环境变量:

系统变量：

2、安装和配置vue

2.1、安装：

命令：npm install vue -g   （或：cnpm install vue -g）

2.2、验证安装：

命令：npm list vue               

           npm list vue -g

2.3 、安装webpack

命令：npm install webpack -g

查看：npm webpack -v

2.4、安装webpack-cli

3、安装脚手架vue-cli 

命令：npm install @vue/cli -g

查看安装的包：

命令：npm list -global

4、创建vue项目

命令：vue create vuedemo

注：根据自己项目的需要进行选择，后期也可以根据需要重新安装

上下键控制，空格选择或取消，回车确定

选择：Manually select features

选择：Babel

选择：3.x

选择：In package.json

此刻已经安装完成了

最后进行项目目录，执行npm run serve

浏览器打开： http://localhost:8080/即可得到以下页面