vue-cli 与 yarn 安装

vue-cli 与 yarn 安装

1、安装node

前往node官网下载node 然后安装。
安装完成后 node -V 查看node版本
npm -V 查看npm版本
安装淘宝镜像,在管理员黑窗口执行一下命令
npm install -g cnpm --registry=https://registry.npm.taobao.org

2、安装vue

在管理员黑窗口执行一下命令
npm/cnpm install vue
vue -v 查看版本

4、安装webpack

在管理员黑窗口执行一下命令
npm/cnmp install webpack -g或者(npm/cnpm install -g webpack)
注意:webpack 4.X 开始,需要安装 webpack-cli 依赖 ,所以使用这条命令 npm install webpack webpack-cli -g
webpack -v 查看版本

3、安装yarn

在管理员黑窗口执行一下命令
npm/cnpm install -g yarn
yarn --version 查看版本
如果是windows系统需下载.msi文件进行安装 下载地址
Yarn 淘宝源安装,分别复制粘贴以下代码行到在管理员黑窗口运行即可
① yarn config set registry https://registry.npm.taobao.org -g
② yarn config set sass_binary_site http://cdn.npm.taobao.org/dist/node-sass -g

4、yarn 安装 vue-cli

在管理员黑窗口执行一下命令
yarn global add @vue/cli

5、配置path环境变量

在管理员黑窗口输入
yarn global dir
查找到yarn path
vue-cli 与 yarn 安装
复制路径在我的电脑=》属性=》高级系统设置=》高级=》环境变量=》系统变量=》path=》编辑
win7系统:;+路径
win10系统:新增复制
配置完成后在管理员黑窗口
输入 vue
vue-cli 与 yarn 安装
即可使用vue
通过黑窗口进入某个文件进行创建项目测试查看是否安装成功
在黑窗口输入
vue init webpack 项目名称(英文)
vue-cli 与 yarn 安装
回车键执行
vue-cli 与 yarn 安装
创建项目后会提示操作,选择user yarn回车后等待创建项目
vue-cli 与 yarn 安装
提示success即项目创建成功
黑窗口进入创建项目根目录
执行 yarn run dev 等待执行
vue-cli 与 yarn 安装
复制http://localhost:8080在浏览器中打开
vue-cli 与 yarn 安装
项目创建成功

本文章个人的一点心得,如有意见建议请大家评论