文章目录

1、Vue脚手架
2、安装
- 2、1 下载安装node.js
- - 下载node.js
  - 安装node.js
  - 测试node.js
- 2、2 配置npm的源
- 2、3 使用npm安装@vue/cli

1、Vue脚手架

脚手架顾名思义就是搭建工程的一个工具，脚手架有很多，Vue CLI是其中的一种。Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统，用于快速创建Vue项目。类似制作PPT时选择模板进行制作。模板相当于CLI的功能。

2、安装

Vue CLI 的包名称由 vue-cli 改成了 @vue/cli。
Vue CLI 4.x 需要 Node.js v8.9 或更高版本 (推荐 v10 以上)。

2、1 下载安装node.js

下载node.js

Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行时。
官方网站：https://nodejs.org/en/
中文网站：http://nodejs.cn/

上述的node.js版本不支持Windows 7版本，支持Windows 10及以上版本。

安装node.js

安装时把WebStorm关闭，这样安装node.js后，WebStorm会自动找到node.js的位置。

测试node.js

2、2 配置npm的源

NPM （Node Package Manager），是NodeJS的包管理器，会随同NodeJS一起安装。
获取原本镜像

npm get registry

由于npmjs.org的服务器在国外（即在“墙”外），国（墙）内开发者做项目的时候，很多“包”的下载速度极慢。
在这种环境下阿里巴巴推出了淘宝NPM镜像，它把npm官方的“包”全部搬到国内，供广大开发者使用。

淘宝镜像升级官方说明如下：

域名切换规则：

http://npm.taobao.org => https://npmmirror.com
http://registry.npm.taobao.org => https://registry.npmmirror.com

2021年9月份淘宝镜像地址修改为： https://registry.npmmirror.com
淘宝镜像官网：http://www.npmmirror.com/

（1）淘宝镜像如何使用

方法1 临时使用

npm --registry https://registry.npmmirror.com install [依赖的名称]

方法2 持久使用

npm config set registry https://registry.npmmirror.com/

npm换源后验证：

npm config list 或  npm get registry

结果如下：

还原npm镜像配置（切换为官方源）

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

方法3 安装cnpm（推荐）
可以使用淘宝定制的 cnpm (gzip 压缩支持) 命令行工具代替默认的 npm。cnpm是淘宝推出的包管理工具。

npm install -g cnpm --registry=https://registry.npmmirror.com

这种方式既不会影响npm命令，又不用每次都写淘宝地址进行依赖包的安装。

cnpm安装的时候，会从这里设置的registry即https://registry.npmmirror.com 安装所有模块。
当安装的时候发现安装的模块还没有同步过来, 淘宝 NPM 会自动在后台进行同步, 并且会让你从官方 NPMregistry.npmjs.org进行安装。下次你再安装这个模块的时候, 就会直接从淘宝 NPM 安装了。

使用cnpm:

cnpm install xxx

2、3 使用npm安装@vue/cli

npm install -g @vue/cli

-g代表全局安装。

可以用下面的命令来检查其版本：

vue --version

如需升级全局的 Vue CLI 包，请运行：

npm update -g @vue/cli

01 安装Vue脚手架相关推荐

vue开发搭建（npm安装 + vue脚手架安装）
一.概念 1.npm: Nodejs下的包管理器. 2.webpack: 它主要的用途是通过CommonJS的语法,把所有浏览器端需要发布的静态资源,做相应的准备,比如资源的合并和打包. 3.vue ...
关于npm和yarn 安装vue脚手架
第一篇博客有点小紧张.轻喷~ 第一步:安装node.js 地址 --------https://nodejs.org/en/ 详细步骤这里就不写了可以去看地址 ----- ...
Vue.js-Day03-AM【超级详细：Node.js环境安装、安装淘宝镜像（Win、Mac）、安装Vue脚手架、初始化Vue项目-命令解释（Vscode、命令行窗口）、目录介绍、Vue文件介绍】
Vue.js实训[基础理论(5天)+项目实战(5天)]博客汇总表[详细笔记] 目录 1.Node.js-环境安装 1.1.Node.js-详细安装步骤 2.vue-cli脚手架安装 2.1.安装 ...
npm——安装教程、安装vue脚手架(ASP.NET Core微服务(五)——【vue脚手架解析接口】过度章节)
npm:是随同NodeJS一起安装的包管理工具,能解决NodeJS代码部署上的很多问题. 比如常用的有: 1)允许用户从NPM服务器下载别人编写的第三方包到本地使用. 2)允许用户从NPM服务器下载并 ...
nodejs绿色版下载安装及配置淘宝镜像、安装vue脚手架
目录一.下载地址二.安装三.测试四.环境配置五.配置淘宝镜像六.安装vue脚手架一.下载地址 nodejs下载详图: 二.安装傻瓜式安装这里我就不多说了(一直点确定就完事了) 三.测 ...
安装vue脚手架出现GET httpsregistry.npmmirror.comvue-cli-g response 404 status
安装vue脚手架出现GET https://registry.npmmirror.com/vue-cli-g response 404 status 解决方案: win10: 在windows Pow ...
使用npm安装vue脚手架
通过npm安装vue脚手架准备工作安装node.js node.js中集成npm 下载地址:node下载连接下载好后可以通过cmd命令查看是否安装成功安装cnpm(可选) 由于有些npm资源被 ...
如何安装vue脚手架
第一步,首先安装node.js 打开官网下载 | Node.js 选择对应的安装包,一直点next即可第二步,安装vue脚手架打开终端,通过win+R,输入cmd, 为了能更快的下载脚手架,可以安 ...
手把手教你安装vue脚手架
第一步先安装Node.js Node.js官网 https://nodejs.org/zh-cn/download/ windows点击这个即可下载好之后,就可以开始安装了最好选择Add to ...

01 安装Vue脚手架