vue开发环境搭建

# 1 安装环境

## 1.1 Node.js以及npm

> 建议安装在默认位置

**Windows 64位** [10.14.2 LTS](https://nodejs.org/dist/v10.14.2/node-v10.14.2-x64.msi)

**macOS 64位** [10.14.2 LTS](https://nodejs.org/dist/v10.14.2/node-v10.14.2.pkg)

使用国内的 [cnpm](https://github.com/cnpm/cnpm) (gzip 压缩支持) 命令行工具代替默认的 `npm`:

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

## 1.2 使用yarn(可选)

macos使用Homebrew安装

```
brew install yarn
```

windows：[安装链接](https://yarn.bootcss.com/latest.msi)

## 1.3 全局安装Vue-cli

```
cnpm install -g @vue/cli
# 或者
yarn global add @vue/cli
```

检测是否安装成功

```
vue --version
```

安装兼容旧版本cli(可选)

```
cnpm install -g @vue/cli-init
```

## 1.4 其余工具

### 微信小程序wepy

```bash
cnpm install wepy-cli -g

 

# 2 项目运行

## 2.1Vue 项目

（1）命令行工具进入相关文件夹

（2）安装项目所需依赖

```
cnpm install
# 或(网速较慢)
npm install
# 或
yarn install
```

（3）运行项目

```
npm run serve
# 或者 (如果使用yarn)
yarn serve
```

（4）vue本地反向代理配置说明(改动该配置需要重新运行步骤3)

```json
// 打开项目根目录的vue.config.js
proxy:{
    '/api': {
        target: '地址',
    },
    '/device': {
        target: '地址'
    }
}
```

## 2.2 小程序项目

（1）运行项目

```
wepy build --watch
```

（2）微信开发者工具打开项目目录，即可看到效果