1. cjs

The commonJS module is used to load modules using require on the node side. It does not support the browser side. There is no concept of dependency in front of the module, and dependency information can only be obtained after execution

const $=require('juqery')
const tmp = () = >{
    console.log('---tmp')}module.exports = tmp
Copy the code

2. Amd asynchronous CJS dependency prefixes apply to the browser side

define(['jquery'].() = >{... })Copy the code

3. A set of umD code supports both CJS and AMD specifications

(function (root, factory) {
    if (typeof define === 'function' && define.amd) {
        // AMD
        define(['jquery'], factory);
    } else if (typeof exports= = ='object') {
        // Node, CommonJS, etc
        module.exports = factory(require('jquery'));
    } else {
        // Browser global variables (root = window)
        root.returnExports = factory(root.jQuery);
    }
}(this.function ($) {
    / / method
    function myFunc(){};

    // Expose public methods
    return myFunc;
}));
Copy the code

4. Iife immediate function call expressions can effectively solve the problem of naming conflicts and global variable contamination of the scope

const module = (() = > {
    ...
})()
Copy the code

5. Esm This is one of the most used modularity, using ES6 syntax to import/export dependencies, support asynchronous loading