vue|vue环境搭建 webpack|javascript|vue.js

Vue环境搭建
- 安装Node.js环境
- - 12版
  - 16版
- 安装vue-cli脚手架
- 创建第一个Vue项目
- 安装路由
- vue+elementUI
- 安装Axios

Vue环境搭建 vue-cli：脚手架（相当于创建Maven项目的模板）
安装Node.js环境 12版
刚开始安装Node的时候安装的是12 版本的，能够安装成功，查看版本信息：

node -v 12.x.x
npm -v 6.x.x

但是在我接下来安装Node.js淘宝镜像加速时，cmd弹出警告信息，详情如下：

文章图片

大致意思就是：版本过低不兼容，要升级版本，于是我在官网下载了16版本的Node.js
16版
Node.js 16版安装成功！
安装Node.js淘宝镜像加速器成功！

npm install cnpm -g （-g全局安装）

文章图片

文章图片

安装vue-cli脚手架安装vue-cli 脚手架：

cnpm install vue-cli -g 全局安装
vue list 查看所有模板

文章图片

创建第一个Vue项目安装webpack打包工具

npm install webpack -g 全局
【vue|vue环境搭建】npm install webpack-cli -g 全局
验证安装是否成功：
- webpack -v
- webpack-cli -v

文章图片

初始化一个项目

初始化项目这里我遇到了一个错误：Failed to download repo vuejs-templates/webpack: getaddrinfo ENOTFOUND codeload.github
查阅资料，检查自己的node,vue和webpack安装成功，但就是初始化项目失败！可能因为webpack打包工具需要外网资源，最后参考下面这篇博客得以解决
参考链接：解决报错：vue-cli · Failed to download repo vuejs-templates/webpack: getaddrinfo ENOENT github.com_atubo1234的博客-CSDN博客