commonjs

JavaScript 模块的循环加载实现方法

“循环加载”(circular dependency)指的是,a脚本的执行依赖b脚本,而b脚本的执行又依赖a脚本。 // a.js var b = require('b'); // b.js var a = require('a'); 通常,”循环加载”表示存在强耦合,如果处理不好,还可能导致递归加载,使得程序无法执行,因此应该避免出现。 但是实际上... »

大型JavaScript应用程序架构设计模式

PDF版的PPT下载地址:http://www.slideshare.net/jibyjohnc/jqquerysummit-largescale-javascript-application-architecture 注:在整理的过程中,发现作者有些思想是返来复去地说,所以删减了一部分,如果你的英文良好,请直接阅读英文的PPT。 以下是本文的主要章节: 1. 什么叫“JavaScript大型程序... »

浅析AMD CMD CommonJS规范–javascript模块化加载学习心得总结

根据CommonJS规范,一个单独的文件就是一个模块。AMD可以作为CommonJS模块一个中转的版本只要CommonJS没有被用来同步的require调用。类似的还有 CommonJS Modules/2.0 规范,是 BravoJS 在推广过程中对模块定义的规范化产出。 »

详谈commonjs模块与es6模块的区别

到目前为止,已经实习了3个月的时间了。最近在面试,在面试题里面有题目涉及到模块循环加载的知识。趁着这个机会,将commonjs模块与es6模块之间一些重要的的区别做个总结。语法上有什么区别就不具体说了,主要谈谈引用的区别。 commonjs 对于基本数据类型,属于复制。即会被模块缓存。同时,在另一个模块可以对该模块输出的变量重新赋值。 对于复杂数据类型,属于浅拷贝。由于两个模块引用的对象指向同一个... »

读懂CommonJS的模块加载

叨叨一会CommonJS Common这个英文单词的意思,相信大家都认识,我记得有一个词组common knowledge是常识的意思,那么CommonJS是不是也是类似于常识性的,大家都理解的意思呢?很明显不是,这个常识一点都不常识。我最初认为commonJS是一个开源的JS库,就是那种非常方便用的库,里面都是一些常用的前端方法,然而我错得离谱,CommonJS不仅不是一个库,还是一个看不见摸不... »

js module大战

JS本身是一个多才多艺的语言,一个可以用自己编译自己的自由度极高的语言。正因为这份自由,出现了天花乱坠的规范与框架们,其中最基础的一块便是Module。 来来来,baby们,做个小测试: CommonJS·AMD·CMD·UMD·ES6,这些模块规范,大家熟悉几个? 注意注意:本文乃笔者主观写出的欢快脱线认知,也许和真正的模块形成的历史有所区别。 一切的根源 JS是一个自由度极高的语言,即使没有模... »

详解CommonJS和ES6模块循环加载处理的区别

CommonJS模块规范使用require语句导入模块,module.exports导出模块,输出的是值的拷贝,模块导入的也是输出值的拷贝,也就是说,一旦输出这个值,这个值在模块内部的变化是监听不到的。 ES6模块的规范是使用import语句导入模块,export语句导出模块,输出的是对值的引用。ES6模块的运行机制和CommonJS不一样,遇到模块加载命令import时不去执行这个模块,只会生成... »

如何让node运行es6模块文件及其原理详解

最新版的 node 支持最新版 ECMAScript 几乎所有特性,但有一个特性却一直到现在都还没有支持,那就是从 ES2015 开始定义的模块化机制。而现在我们很多项目都是用 es6 的模块化规范来写代码的,包括 node 项目,所以,node 不能运行 es6 模块文件就会很不便。 让 node 运行 es6 模块文件的方式有两种: 转码 es6 模块为 commonjs 模块 hook no... »

使用rollup打包JS的方法步骤

rollup 采用 es6 原生的模块机制进行模块的打包构建,rollup 更着眼于未来,对 commonjs 模块机制不提供内置的支持,是一款更轻量的打包工具。rollup 比较适合打包 js 的 sdk 或者封装的框架等,例如,vue 源码就是 rollup 打包的。而 webpack 比较适合打包一些应用,例如 SPA 或者同构项目等等。 创建项目 目录结构是这样的: hey-rollup/... »

webpack4.x CommonJS模块化浅析

先看下webpack官方文档中对模块的描述: 在模块化编程中,开发者将程序分解成离散功能块(discrete chunks of functionality),并称之为模块。 每个模块具有比完整程序更小的接触面,使得校验、调试、测试轻而易举。 精心编写的模块提供了可靠的抽象和封装界限,使得应用程序中每个模块都具有条理清楚的设计和明确的目的。 webpack 的核心概念之一就是一切皆模块,webpa... »

ES6与CommonJS中的模块处理的区别

ES6和CommonJS都有自己的一套处理模块化代码的措施,即JS文件之间的相互引用。 为了方便两种方式的测试,使用nodejs的环境进行测试 CommonJS的模块处理 使用require来引入其他模块的代码,使用module.exports来引出 // exportDemo.js count = 1; module.exports.count = count; module.exports.H... »

如何使node也支持从url加载一个module详解

前言 最近两天 ry 大神的 deno 火了一把。作为 node 项目的发起人,现在又基于 go 重新写了一个类似 node 的项目命名为 deno,引发了大家的强烈关注。 在 deno 项目 readme 的开始就列举出了这个项目的优势和需要解决的问题,里面最让我瞩目的就是模块原生支持 ts ,同时也能也必须从 url 加载模块,这也是与现有的 CommonJS 最大的不同。 仔细思考一下,de... »

浅析webpack 如何优雅的使用tree-shaking(摇树优化)

1.什么是tree-shaking webpack 2 的到来带来的最棒的新特性之一就是tree-shaking 。tree-shaking源自于rollup.js,先如今,webpack 2也有类似的做法。 webpack 里的tree-shaking的到来不得不归功于es6规范的模块。为什么这么说,如今的前端模块规范很多,比较出流行的比如commonJS , AMD , es6 ,我简单的说一... »

详解webpack解惑:require的五种用法

webpack中可以写commonjs格式的require同步语法,可以写AMD格式的require回调语法,还有一个require.ensure,以及webpack自己定义的require.include,再加上ES6的import语法,这么多岂不是会把人给搞乱。本篇就来梳理一下这些require各自的特点,以及都在什么场景下使用。 commonjs同步语法 经典的commonjs同步语法如下:... »

深入理解Commonjs规范及Node模块实现

前面的话Node在实现中并非完全按照CommonJS规范实现,而是对模块规范进行了一定的取舍,同时也增加了少许自身需要的特性。使用require()方法来引入再展开介绍require()方法的标识符分析之前,需要知道,与前端浏览器会缓存静态脚本文件以提高性能一样,Node对引入过的模块都会进行缓存,以减少二次引入时的开销。在Node实现中,正是基于这样一个标识符进行模块查找的。 »

使用Browserify来实现CommonJS的浏览器加载方法

Nodejs的模块是基于CommonJS规范实现的,可不可以应用在浏览器环境中呢? var math = require('math'); math.add(2, 3); 第二行math.add(2, 3),在第一行require(‘math’)之后运行,因此必须等math.js加载完成。也就是说,如果加载时间很长,整个应用就会停在那里等。这对服务器端不是一个问题,因为所有... »

Node.js中的模块机制学习笔记

Node.js中的模块机制学习笔记

本文将介绍CommonJS规范及Node的模块机制。Node借鉴了CommonJS的Modules规范实现了一套非常易用的模块系统。注意,Node对引入过的模块都会进行缓存,以减少二次引入时的开销,并对相同模块的二次加载都采用最优先从缓存加载的策略。事实上,Node在编译JS模块过程中会对文件内容进行头尾包装。 »

浅谈Node新版本13.2.0正式支持ES Modules特性

在本月 21 日,即2019.11.21,Node.js 发布了 13.2.0 版本,更新了一些特性。其中最令人兴奋的莫过于正式取消了 –experimental-modules 启动参数。这说明Node.js 正式支持 ES modules。我们一起来看看。 Stability Index说明 Stability Index,即 Api 的稳定指数说明。它包括3个值: Stabili... »

浅谈Webpack4 Tree Shaking 终极优化指南

现在,tree-shaking 的好处将根据你的代码库而有所不同。Webpack 跟踪整个应用程序的 import/export 语句,因此,如果它看到导入的东西最终没有被使用,它会认为那是“死代码”,并会对其进行 tree-shaking 。Webpack 只有在压缩代码的时候会 tree-shaking,而这只会发生在生产模式中。具有副作用的文件不应该做 tree-shaking,因为这将破坏... »

Node对CommonJS的模块规范

Node能够以一种相对程度的的姿态出现,离不开CommonJS规范的影响。Node借鉴CommonJS的Modules规范实现了一套非常易用的模块系统,NPM对packages规范的完好支持使得Node应用在开发过程中事半功倍。 在Node中引用模块,需要经历如下三个步骤。 1. 路径分析 Node中的模块分为核心模块和文件模块 。 核心模块是由Node提供的模块,它们在Node源代码的编译过程中... »

关于JS模块化的知识点分享

模块化是一个语言膨胀的必经之路,它能够帮助开发者拆分和组织代码。Module模式在模块化规范形成之前,JS开发者使用Module设计模式来解决JS全局作用域的污染问题。因为CommonJS需要通过赋值的方式来获取匿名函数自调用的返回值,所以require函数在加载模块是同步的。ES6 moduleES6的模块化已经不是规范了,而是JS语言的特性。而 ES6 模块不是对象,ES6 module 是一... »