【xxx-mall前端-环境搭建】-搭建Vue开发环境

1. 安装nodejs

nodejs中文网下载对应操作系统的nodejs安装包，我这里下载的nodejs版本是：10.12.0

下载地址

https://npm.taobao.org/mirrors/node/v10.12.0/

更改链接中的版本号可进入对应版本的下载页面,我的操作系统是window10，下载的安装包如下:

windows下按win+r,输入cmd进入命令窗口，输入如下命令查看node版本、npm版本

查看node版本

node -v

查看npm版本

npm -v

2. 安装 cnpm

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

3. 安装指定版本的npm

npm install npm@6.4.0 -g
或者
cnpm install npm@6.4.0 -g

4. 安装yarn

npm i yarn -g --verbose
或者
cnpm i yarn -g --verbose

配置yarn

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

yarn和npm的关系

npm install  => yarn install
npm install --save [package] => yarn add [package]
npm install --save-dev [package] => yarn add [package] --dev
npm install --global [package] => yarn global add [package]
npm uninstall --save [package] => yarn remove [package]
npm uninstall --save-dev [package] => yarn remove [package]

5. 安装webpack

npm install webpack -g
或者
cnpm install webpack -g

6. 安装vue-cli

npm install vue-cli -g
或者
cnpm install vue-cli -g

7. 创建工程xxx-mall-web

创建项目，命令行进入创建项目的目录

我这里截图中的目录是从码云上克隆出来的一个空仓库，我在该文件夹下创建项目

vue init webpack xxx-mall-web

安装依赖

# 进入项目文件夹内
cd xxx-mall-web
# 安装依赖
yarn install

启动项目

npm run dev

访问

浏览器访问: http://localhost:8080,出现界面如下，则成功。

到此，从环境搭建到创建项目的工作就完成了。