ES6的模块化规范和CommonJS的模块化规范的差异

ES6 在语言标准的层面上,实现了模块功能,而且实现得相当简单,旨在成为浏览器和服务器通用的模块解决方案。其模块功能主要由两个命令构成:export 和 import。export命令用于规定模块的对外接口,import命令用于输入其他模块提供的功能。

/** 定义模块 math.js **/

var n = 1;

function add(){
    
return 2+3

}

export {
    n,
    add
}


/** 引用模块  main.js**/

import { n , add } from './math.js'


如上例所示,使用import命令的时候,用户需要知道所要加载的变量名或函数名。其实ES6还提供了export default命令,为模块指定默认输出,对应的import语句不需要使用大括号。这也更趋近于ADM的引用写法。

/** export default 定义输出  math.js**/
    //输出
    export default { basicNum, add };
    
/** 引用模块   main.js**/
   
     //引入
    import math from ‘./math‘;
    
    alert(math.n);

    math.add();
}


CommonJS

Node.js是commonJS规范的主要实践者,它有四个重要的环境变量为模块化的实现提供支持:module、exports、require、global。实际使用时,用module.exports定义当前模块对外输出的接口(不推荐直接用exports),用require加载模块。

    //定义模块 math.js       
    var n = 0;
    function add(a, b) {
        return a + b;
    }
    module.exports = { //在这里写上需要向外暴露的函数、变量
        add: add,
        n: n
    }

    /** 引入模块 require **/

    //引用自定义的模块时,参数包含路径,可省略.js
    var math = require(‘./math‘);
    math.add(2, 5);


    //引用核心模块时,不需要带路径
    var http = require(‘http‘);
    http.createService(...).listen(3000);

import 时候的路径问题(新手容易碰到)

  • 开始玩的时候,总是出现 cannot find module 问题,原来 在 import 的时候 如果不使用相对路径或者绝对路径,node默认会去node_modules/文件夹下去找,例如:

import * as obj from 'nav'

// node 会试着去寻找 node_modules/nav.js 文件,如果没有找到会接着找 nav 文件夹,如果文件夹存在,会找文件夹内的index.js文件,找不到就会报错

// 正确写法
import * as obj from './exports'

原文地址:https://www.cnblogs.com/koala0521/p/7862553.html