# Code Compilation

The following code compilation capabilities are provided.

# Conversion from ES6 to ES5

As of version 0.10.101000, babel is used by default to convert developers' syntax code from ES6 to ES5 for compatibility across three different platforms. This helps developers solve development problems caused by runtime environments.

Notes:

  • To improve code quality, when the ES6 conversion feature is enabled, javasctipt strict mode is used by default. See "use strict".

# Enhanced Compilation

Starting in version 1.02.1904282, the option Enhanced Compilation was added to enhance the conversion from ES6 to ES5 capability. In addition, new compilation logic and additional options are also provided for developers.

The following table compares the capabilities of original compilation and enhanced compilation:

Attribute Original Logic Enhanced Compilation
Babel version babel6 babel7
Presets es2015, stage0 env {chrome:53, ios:8}
Helpers Single file inline Cross-file sharing
Async/Await Unsupported Supported
Strict mode switch Unsupported Supported
Ignore file directory Unsupported Supported
Code compression uglify-js terser
Babel plug-in - a set of proposal*
polyfill Most are es6 Added 3 new polyfill*
  • Preset-env is used and the latest ECMAScript syntax is supported.
  • Shares Babel auxiliary functions, which are in the @babel/runtime directory by default and configured via Project Configuration File.
  • Supports async/await syntax. Add regeneratorRuntime as needed. The directory position is the same as the auxiliary function.
  • When the first line in the file is // use strict disable;, the strict mode is suspended in the current file.
  • You can forbid the compilation of any file or directory via project configuration file (such as miniprogram_npm).
  • The original logic supports stage0 syntax. For the purpose of forward compatibility, a set of proposal plug-ins is introduced.
  • For polyfill, a large number of es6 related polyfills are introduced to the base library. Click to see details. Array.prototype.includes(es7), Object.entries(es8), and Object.values(es8) are added in enhanced compilation.

# Style Completion

Once enabled, Weixin DevTools will automatically detect and supplement missed styles to ensure normal display on systems with older versions. Although this option can help avoid most such issues, we recommend that developers check the real performance of Mini Programs on both iOS and Android.

# Compressed Code

Once enabled, Weixin DevTools will help developers compress and obfuscate javascript code when uploading code, reducing the size of code packages.

# Code Protection

When this option is enabled, Weixin DevTools will attempt to protect the project code, mainly by flattening the file and replacing the file name referenced by require. This feature is not suitable for the following situations:

  1. This feature does not work well when a Mini Program only contains simple pages.
  2. If a file is greater than 500 KB and references files in the project using require, a prompt message of "File not found" may appear when the code is running.
  3. Dynamic reference, such as var a = 'somefile.js'; require(a);
  4. The require function is assigned to other variables, such as var a = require; a('somefile.js');
  5. require is used as a parameter of a binary operator, such as require + 1;.
  6. The ... operator is used without enabling ES6-to-ES5 conversion

# Enable Multi-core Compilation

This option is visible on computers with four or more cores. When this option is enabled, CPU resources are fully utilized to compile the project's JS code in a more efficient manner. You can also disable this option.