想高效开发小程序，mpvue了解下（二）

序言

上一节分享的内容呢，主要是围绕“小程序的现状”、“什么是mpvue？”、“搭建基础架构”等几个话题展开的。这一节呢，主要是以“小程序部署到腾讯云”为主题进行分享的。对于为啥要将小程序部署到腾讯云后台呢，如下是我的看法。通常项目在上线部署环境的时候须要多个流程，腾讯云会将上面一整套上线部署的标准打了个包，同时呢也提供了免费的开发环境，等到上线的时候买个域名+服务器就能够了。这就是我我的推荐使用腾讯云的缘由。

腾讯后台搭建

那如何上传测试代码到腾讯云呢？接下来Eknow君会按照几个步骤来完成这个流程。

1. 登陆到腾讯云
   因为要搭建腾讯云开发环境，首先就要进入腾讯云后台进行本地的配置。
   【小程序后台】-【设置】-【开发者工具】-【腾讯云】

1. 下载node.js Demo
   找到开发环境中的下载测试代码，将其download下来，打开里面的文件夹，由于开发的小程序代码属于client端，因此只须要拿取server文件夹便可。
   【下载node.js版本demo】-【wafer压缩包】-【server】

2. 部署到mpvue初始化的项目
   复制server文件夹到已经使用mpvue初始化的项目test根目录下，同时修改project.config.json的文件，将云端路径更改成本地的server路径。

"qcloudRoot":"./server",

[图片上传中...(image-6f7f9a-1541646149937-3)]

1. 开始上传
   上面几个步骤也就配置完了，接下来就在微信开发者工具将代码上传到腾讯云后台，上传过程当中须要注意的是将node_modules给去掉；同时按照模块上传，等待上传成功，整一套流程也就基本完成了。

本地开发环境的搭建

在开发者工具中，有一个不太友好的地方在于每次修改后台代码的时候都要上传代码到腾讯云，这会致使效率大大下降，所以能够考虑下搭建本地环境。固然腾讯云有着相关的开发文档，参照着官方文档能够很快地搭建好。下面Eknow君分享下搭建的过程。

1. 配置config.js
   既然要参考文档，咱们便须要从【腾讯云】-【文档平台】-【 微信小程序开发者工具】-【 常见问题 】-【node相关】入手，找到【本地如何搭建开发环境】这一小节，即可以进行相应地配置。找到以前部署到mpvue初始化的项目里【server】-【config.js】，将下面的代码对应粘贴进去。同时将端口改成5757。

const CONF = {
      // 其余配置 ...
    serverHost: 'localhost',
    tunnelServerUrl: '',
    tunnelSignatureKey: '27fb7d1c161b7ca52d73cce0f1d833f9f5b5ec89',
      // 腾讯云相关配置能够查看云 API 密钥控制台：https://console.cloud.tencent.com/capi
    qcloudAppId: '您的腾讯云 AppID',
    qcloudSecretId: '您的腾讯云 SecretId',
    qcloudSecretKey: '您的腾讯云 SecretKey',
    wxMessageToken: 'weixinmsgtoken',
    networkTimeout: 30000,
    port: '5757',
}

从上面的代码能够看出，qcloudAppId、qcloudSecretId、qcloudSecretKey三个属性须要本身配置。

1. 配置MySQL
   配置完config.js以后呢，就是要初始化数据库环境了。在这里分为2步，
   第一，启动数据库服务。在这里Eknow君推荐phpstudy，能够不用再手动安装Apache等，直接打开http://localhost/phpMyAdmin/,帐号密码都是默认的root。按照模板建立cAuth数据库，同时在server里的config.js进行MySQL配置。
   第二，打开cmd面板，安装依赖

cd server
npm install
//安装全局依赖，用来热启动，方便进行调试
npm install -g nodemon

同时初始化数据库

node tools/initdb.js

在这里须要注意一个地方，执行这个命令颇有可能报MySQL错误。

Incorrect table definition; there can be only one TIMESTAMP column with CURRENT_TIMESTAMP in DEFAULT or ON UPDATE clause

这句话的意思呢，是指表中出现多个timestamp并设置为current_timestamp，此时建立表失败。所以咱们须要找到【server】-【tools】-【cAuth.sql】对create_time字段进行修改，

`create_time` datetime NOT NULL COMMENT '建立时间',
  `last_visit_time` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP,

修改完后再执行一遍初始化数据库的命令，成功后查看下数据库信息。
最后，须要本地启动调试环境，启动debug模式。

1. 测试本地服务
   最后，咱们须要测试下本地的是否成功运行。首先，找到【server】-【controllers.js】-【建立demo.js】，暴露一个json信息。

module.exports = ctx => {
   ctx.state.data={
     msg : 'Hello Mr.Eknow'
   }
}

打开浏览器，输入http://localhost:5757/weapp/demo
到此，整个小程序的本地开发环境便成功搭建起来了。有点小激动~

总结

经过上面的一系列操做后，小程序上传测试代码到腾讯云还有搭建腾讯云后台本地开发环境的方法已经分享完。老铁们也应该对mpvue的建立与腾讯云的搭建有了必定的了解，基石已经搭好，Eknow君在这里仍是建议多敲敲代码，兴许能发现新的坑位等着来铺哟。

• • *