AMD/CMD/COMMJS/ES6模块化

AMD

AMD 是 RequireJS 在推广过程中对模块定义的规范化产出 。

• 定义模块
  define（[] ,function(){}）

  //define 定义模块，接收两个参数.

  //第1个参数，必须是一个数组，指明该模块的依赖性

  //第2个参数是一个回调函数。

  //一个模块只能有一个define(每个 JavaScript 文件就是一个独立的模块)

• 调用模块
  require（[],function(){}）
  //第1个参数是一个数组，表示所依赖的模块(调用)
  //第2个参数是一个回调函数，当前面指定的模块都加载成功后，它将被调用。

• 模块配置

 require.config({

   	 	baseUrl: 'https://cdn.bootcdn.net/ajax/libs/', //配置公共路径

​    		paths: {

​        			'jquery': 'jquery/3.5.1/jquery',//paths里面填写需要的包

​        			'jqcookie': 'jquery-cookie/1.4.1/jquery.cookie' //路径后面不能有js文件的扩展名

​    			}

​		})

• 使用

<script src="js/require.js" defer async="true" data-main="程序主入口"></script>
//async属性表明这个文件需要异步加载，避免网页失去响应。IE不支持这个属性，只支持defer，所以把defer也写上。
//data-main属性的作用是，指定网页程序的主模块,意思是整个网页的入口代码,所有代码都从这儿开始运行,文件名自定义。

COMMONJS

COMMONJS是一个nodejs的规范，需要在node环境下运行，是最早的规范。

• 模块定义
  module.exports=函数/数组/对象…

• 调用模块
  require（）

• 模块配置
  引入模块的路径./ …/

ES6模块化

• 模块定义
  export{}暴露模块
  例如:
  ​

let name = 'zhangsan';

​	let age = 100;

​	function fn(a, b) {

   	return a + b;

​	}

​	export {name,age,fn}

• 调用模块

	import{ name,age,fn} from ' ' //当前目录，如果不添加，从node_module里面去找这个模块。

	import{ name as username} form ' ' //as修改名称

• 使用

<script src="" type="moudle"></script>//type='moudle'一定要加

CMD

CMD 是 SeaJS 在推广过程中对模块定义的规范化产出 。