前端模块化

48 阅读1分钟

什么是前端模块化?

将独立的功能代码封装成一个独立的文件供其他的模块引入使用,在项目内部中存在模块化的概念。

为什么要使用模块化

有利于代码结构的拆分,减小代码文件的大小,用数量换取文件的大小,便于代码维护与复用。

目前实现模块化的规范有哪些

CommonJS、ES6、AMD、CMD、UMD

说简单点,对于目前的模块化规范来说,只关注在文件的引入导出(使用方法)上存在区别,原理暂且不管。

模块化规范名称使用方法特点对应实现
CommonJS引入require 导出module.exports针对服务端,一般采用同步加载模块NodeJs
ES6引入import 导出export针对浏览器,一般采用异步加载模块
AMDscript标签引入requirejs <script src="js/require.js"></script> 引入require 导出define()针对浏览器,一般采用异步加载模块requirejs
CMD<script src="js/lib/sea.js"></script> <script >seajs.use('……')</script>引入require 导出define()针对浏览器,一般采用异步加载模块seajs
UMD引入AMD+CommonJS