前端模块化（一）nodeJS中的CommonJS规范

Charlie_Jade 发布于2019-08-22 18:10 / 875人阅读

摘要：要想让模块再次运行，必须清除缓存。模块加载的顺序，按照其在代码中出现的顺序。最近参加了公司开展的一次培训，结构性思维培养。

序言

模块化，大家用vue，react等东西，都会接触到像exports，module.exports，export，export default，require，define，import等等字段，感觉很多人对于这些东西还是分不清，概念非常的模糊，便想着写这么一篇文章，一是帮助自己梳理知识点，二是跟大家一起成长。其中有写得不对的，请及时提出来，我及时更正。

刚开始写的时候有些无从下手，一是因为知识点太多，二是因为自己的经验还不足以帮助大家从深层次剖析js的模块化中的区别，以及其实现原理、思想。这是一篇自己的学习笔记整理，我只能带大家了解前端模块化，区分他们并正确的使用他们。

先给大家扔出几条知识：

CommonJS：NodeJS模块系统具体实现的基石。

AMD：异步模块规范，是RequireJS在推广过程中对模块定义的规范化产出的，推崇依赖前置；

UMD：兼容AMD和commonJS规范的同时，还兼容全局引用的方式；

CMD：是SeaJS 在推广过程中对模块定义的规范化产出的，推崇依赖就近；

ES6：ES6模块的设计思想是尽量的静态化，使得编译时就能确定模块的依赖关系，以及输入和输出的变量；

CommonJS规范

CommonJS官网上写道，它希望js不仅仅可以在浏览器上运行，而是可以在任何地方运行,使其具备开发大型应用的能力。

javascript: not just for browsers any more!

CommonJS定义的模块分为:

模块引用(require)

模块定义(exports)

模块标识(module)

他可以做到：

服务器端JavaScript应用程序

命令行工具

图形界面应用程序

混合应用程序（如，Titanium或Adobe AIR）

CommonJS模块的特点如下

所有代码都运行在模块作用域，不会污染全局作用域。

模块可以多次加载，但是只会在第一次加载时运行一次，然后运行结果就被缓存了，以后再加载，就直接读取缓存结果。要想让模块再次运行，必须清除缓存。

模块加载的顺序，按照其在代码中出现的顺序。

先谈一谈包的概念

前面给大家说过，node.js是基于CommonJS的规范实现的，NPM大家一定都很熟悉，它实践了CommonJS的包规范。

包规范

关于包规范，类比于git仓库，我们可以这么理解:

git init在当前文件夹中生成了隐藏文件.git，我们把它叫做git仓库。

npm init命令在当前文件夹中生成了配置文件package.json，它描述了当前这个包，我们管这个文件叫做包（概念不准确，可以这么理解）。

包结构

严格按照CommonJS规范来的话，包的目录应当包含以下文件或目录。

package.json：包描述文件，存在于包顶级目录下

bin：存放可执行二进制文件的目录

lib：存放js代码的目录

doc：存放文档的目录

test：存放单元测试用例代码的目录

而package.json则是一个配置文件，它描述了包的相关信息。

NodeJS模块

既然node.js是基于CommonJS实现的，那么我们先来简单看看NodeJS的模块原理。

最近参加了公司开展的一次培训，结构性思维培养。任何东西都能够进行分类，事物一旦进行分类，更利于大家对此事物的认知，也能方便大家记忆。所以我们先来看看Node的模块分类

云服务器 GPU云服务器前端规范前端规范文档 nodejs模块 Nodejs模块封装

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/95576.html

【js基础】前端模模块化知识点整理

摘要：其中命令用于输入其他模块提供的功能，命令用于规定模块的对外接口。简单记录下自己对前端模块化的一些浅薄理解，不对之处欢迎指正在介绍前端模打包工具之前，我们先简单说一下浏览器、v8和nodejs，因为我们现在用到的大部分前端模打包工具，都是需要nodejs环境运行的，同时他们都能通过npm进行下载 1. 浏览器：浏览器组成可分两部分：Shell+内核。浏览器内核又可以分成两部分：渲染...

IamDLY 2019-08-21 17:49 评论0 收藏0
关于JavaScript模块规范之CommonJSAMDCMD

摘要：所有依赖这个模块的语句，都定义在一个回调函数中，等到加载完成之后，这个回调函数才会运行。也采用语句加载模块，但是不同于，它要求两个参数第一个参数，是一个数组，里面的成员就是要加载的模块第二个参数，则是加载成功之后的回调函数。本篇文章来自对文章《js模块化编程之彻底弄懂CommonJS和AMD/CMD！》的总结，大部分摘自文章原话，本人只是为了学习方便做的笔记，之后有新的体会会及时补充...

binaryTree 2019-08-26 13:22 评论0 收藏0
前端构建工具整理

摘要：常见前端构建工具的分类和对比是附带的包管理器，是内置的一个功能，允许在文件里面使用字段定义任务在这里，一个属性对应一段脚本，原理是通过调用去运行脚本命令。前文端技术范围不断发展，前端开发不仅限于直接编写html，css和javascript，Web应用日益庞大，代码也更加庞大，因此许多新的思想（例如模块化和工程化等）和框架（React和Vue等），以及新的语言（Es6 TypeSc...

leo108 2019-08-23 10:53 评论0 收藏0
JS模块化编程

摘要：也就是说，外部模块输出值变了，当前模块的导入值不会发生变化。三规范的出现，使得模块化在环境中得到了施展机会。模块化这种加载称为编译时加载或者静态加载。总结的模块化规范经过了模块模式的演进，利用现在常用的打包工具，非常方便我们编写模块化代码。前言什么是模块化？模块就是实现特定功能的一组方法,而模块化是将模块的代码创造自己的作用域，只向外部暴露公开的方法和变量，而这些方法之间高度解耦...

骞讳护 2019-08-26 13:34 评论0 收藏0
前端模块化详解

摘要：提倡依赖前置，在定义模块的时候就要声明其依赖的模块。适用场景按需加载条件加载动态的模块路径注关于模块化，详细见阮一峰的入门模块与模块化区别模块化的规范和两种。模块化开发方便代码的管理，提高代码复用性，降低代码耦合，每个模块都会有自己的作用域。当前流行的模块化规范有CommonJS，AMD，CMD，ES6的import／export CommonJS的主要实践者就是nodejs,一般...

zhangfaliang 2019-08-23 17:11 评论0 收藏0