# 快速上手

注意

请确保你的 Node.js 版本 >= 8。

# 新项目安装

# 假设你已经全局安装了最新版的 vue-cli
# 使用 vue-cli 创建一个新的 vue 项目
# 已支持 Typescript 项目
$ vue create project

# 切换到项目目录下
$ cd project

# 安装 vue-apicloud-quickstart
# 将自动识别项目是否使用 Typescript
$ vue add @w-xuefeng/apicloud

或者在项目目录下执行

$ npm i @w-xuefeng/vue-cli-plugin-apicloud     # 或者使用 yarn
$ vue invoke @w-xuefeng/apicloud

根据提示语句输入相关信息即可完成安装

? 请输入项目 ID (Please enter the app id of your project) A6000000000001
? 请输入项目名称 (Please enter the app name of your project) vue-apicloud-template
? 请输入项目描述 (Please enter the description of your project) A Vue.js APP with APICloud
? 请输入项目作者 (Please enter the author of your project) @w-xuefeng/vue-cli-plugin-apicloud
? 请输入运行项目的端口号,默认 8080 (Please enter the port number of the running project, the default is 8080) 8080
  • APICloud 项目 ID,在 APICloud 控制台获取。这里默认为 A6000000000001(非真实 ID,仅作展示使用,请替换为自己项目的真实 ID)
  • 项目名称,默认 vue-apicloud-template
  • 项目描述,默认 A Vue.js APP with APICloud
  • 项目作者,默认 @w-xuefeng/vue-cli-plugin-apicloud
  • 运行项目的端口号,默认 8080

注意

APICloud 项目 ID 与 自定义 Loader 的项目 ID 是一致的,否则无法进行 WiFi 调试

若 8080 端口已经被其他程序占用,你应该输入一个新的未被占用的端口号。 安装完成后,如果要修改端口号,你应该要修改 package.json"serve": "vue-cli-service serve --port 8080"的端口号 与 index.htmlurl: 'http://你的IP地址:8080/indexindex.html'中的端口号,然后重启项目并执行一次 WiFi 同步。

同样的,在 WiFi 调试的时候,如果你的本地 IP 发生了变化的话,你需要修改 index.htmlurl: 'http://你的IP地址:8080/indexindex.html'中的 IP 地址,然后执行一次 WiFi 同步。

# 现有项目

如果你想在一个现有项目中使用 vue-apicloud-quickstart,则首先应该将本地的修改进行提交,因为安装 vue-apicloud-quickstart 之后,会对本地项目文件进项修改。同上,根据提示语句输入相关信息即可完成安装。

# 安装
$ vue add @w-xuefeng/apicloud

或者在项目目录下执行

$ npm i @w-xuefeng/vue-cli-plugin-apicloud    # 或者使用 yarn
$ vue invoke @w-xuefeng/apicloud

根据项目需要,自行决定是否保留更改。

✔  Successfully invoked generator for plugin: @w-xuefeng/vue-cli-plugin-apicloud
   The following files have been updated / added:

     .syncignore
     config.xml
     index.html
     public/res/img/logo.png
     src/assets/img/logo.png
     src/config/pages.js
     src/pages/home/index.vue
     src/pages/home/web.vue
     src/pages/index/index.vue
     src/pages/login/index.vue
     vue.config.js
     .gitignore
     package.json
     public/index.html
     src/assets/logo.png
     src/components/HelloWorld.vue
     src/main.js
     yarn.lock

   You should review these changes with git diff and commit them.