【WeLink开放平台】技术指南：第三方应用简易模板适配H5项目迁移指南

简易模板可将 src 目录里面的文件，直接复制并上传。支持使用IDE一键调试、预览和上传。

适用于纯html+css+js进行开发，且未使用 webpack、gulp 等构建工具旧项目的迁移。

迁移步骤

1、新建简易模板：IDE首页->模板选取->基础类模板->选择并新建“简易模板”

2、复制目录：可将H5项目的目录复制到简易模板的 src 目录中

3、配置 plugin.json：

在项目根目录下的 plugin.json 文件中的 indexURL 需要配置成对应 src 目录下的 html 文件。

plugin.json

  {    "indexURL": "h5://appid/index.html",    "appId": "",    "minSdkVersionName": "",    "versionName": "1.0.0"
  }

备注：访问 h5://appid/ 目录可理解为访问 src 目录，如访问h5://appid/index.html即访问 src/index.html。

4、使用JSAPI：需在 html 中引用 JSAPI 脚本和样式组件文件

src/index.html

  <!-- 引入统一的css文件，需注意引用层级 -->
  <link href="../../../common/css/hwh5.css" rel="stylesheet" />
  <!-- 引用We码小程序JSAPI，需注意引用层级 -->
  <script type="text/javascript" src="../../../common/js/hwh5.js"></script>
  <!-- 测试JSAPI是否可用 -->
  <script>
    HWH5.getWecodeInfo().then(function (data) {      console.log(data);
    }).catch(function (error) {      console.log(error);
    });  </script>

在We码小程序里，由于安全问题，使用 XHR 请求会被禁用，需统一整改成使用 HWH5.fetchInternet JSAPI。

开发阶段建议引入 vConsole 脚本，方便调试和输出日志信息，请参考 vConsole。

注意事项

由于简易模板只是做了简单复制，并不会将 ES6 语法进行转换。所以，项目中请使用 ES5 语法，避免浏览器兼容问题。