WeChat Mini Program Tool Project Page Card Three Main Functions


The project page card has three main functions

Display current project details

Including icon, AppID, directory information, as well as the time of the last code submission and code package size.

Submit preview and submit upload

  • Click the preview function, the tool will upload the source code to the WeChat server, and a QR code will be displayed after success. Developers can use the new version Scan the QR code on WeChat to see the real performance of the corresponding project on your mobile phone.
  • Click upload, and the tool will upload the source code to the WeChat server. Developers can see the status of this submission in the mp management background. It should be noted that during the internal testing period, the code upload function is only operable by the administrator’s WeChat account.

Project configuration

ES6 to ES5

WeChat applet runs on three terminals: iOS, Android and developer tools for debugging

  • On iOS, the javascript code of the mini program is run in JavaScriptCore
  • On Android, the javascript code of the mini program is parsed through the X5 kernel
  • In development In terms of tools, the javascript code of the mini program runs in nwjs (chrome kernel)

Although the environments of the three terminals are very similar, at least for now there are still some differences, which gives many developers Causes great trouble.

In the development tools of 0.10.101000 and later versions, babel will be used by default to convert the developer code ES6 syntax to one that is well supported by all three ends. ES5 code helps developers solve development problems caused by different environments. Developers can turn off this feature in project settings.

It should be noted that:

  • This conversion will only help developers deal with grammatical problems. The new ES6 APIs such as Promise etc. Developers need to introduce Polyfill or other libraries themselves.
  • In order to improve code quality, when the ES6 conversion function is turned on, javasctipt strict mode is enabled by default, please refer to "use strict".

Listen to file changes and automatically refresh developer tools

Enable this option. When files related to the current project change, it will automatically help developers refresh the debugging simulator, thereby improving Development efficiency.

Compress code

Enable this option, and the development tool will help developers compress the javascript code when uploading the code to reduce the size of the code package.

Style Completion

Enable this option, and the development tool will automatically detect and complete missing styles to ensure normal display on iOS8.

Do not verify the requested domain name and TLS version

If this option is turned on, the development tool will not verify the secure domain name and TLS version, helping to better complete debugging during the development process.

1481078094105584.png