（Commonjs、amd或者es6的import，webpack都会对其进行分析。来获取代码的依

CommonsJSmodule：模块标识require：模块引用export：模块输出CommonJS一个模块就是一个脚本文件，require命令第一次加载脚本时，就会执行整个脚本，然后在缓存中生成一个对象

前情提要我们平时使用的npm第三方包一般基于这两种规范开发的，很容易遇到一个项目里既有CommonJS又有ESModule的情况，那么我们应该如何解决这种CommonJS和ESModule混合开发的问题呢

一、模块化编程：按模块划分，模块之间是独立的「也能相互调用」单例设计模式AMDrequire.jsCMDsea.js「CommonJS」CommonJSNode.jsES6Module基于闭包避免全局变量污染想实现各版块之间方法的相互调用

一、设置ES模块化默认情况下，node中的模块化标准是CommonJS，想要使用ES的模块化，可以采用以下两种方案：1.使用mjs作为扩展名。

CommonJS的一个模块，就是一个脚本文件。require命令第一次加载该脚本，就会执行整个脚本，然后在内存生成一个对象。

因此诞生了CommonJS(NodeJS),AMD(sea.js),ES6Module(ES6,Webpack),CMD(require.js)等模块化规范。什么是模块化？

完全符合CommonJs规范的包目录一般包含如下这些文件。package.json:包描述文件。bin:用于存放可执行二进制文件的目录。lib:用于存放JavaScript代码的目录。

原理：CommonJS与import()方法一：CommonJS模块语法利用require.ensure,require.ensure()是webpack特有的，已经被import()取代。

//截图import{Sobject}from'@/Common/Commonjs/Sobject'importManagerCesiumfrom'@/Common/Manager/ManagerCesium'letCesium

相比于早期制定的CommonJS规范，ES6的模块化设计有3点不同。CommonJS在运行时完成模块的加载，而ES6模块是在编译时完成模块的加载，效率要更高。

原理是转换成commonjs对象，本质是js，里面内容是样式字符串。同时还需要style-loader，因为打包后的css一般都

**CommonJs标准(导入导出)语法和示例导出代码示例导入代码示例语法和示例语法：导出==》》module.exports={}导入==》》require(‘模块名或路径’)模块名或路径：分为两种：

typeofdefine==='function'&&define.amd){//AMDdefine(['jquery'],factory);}elseif(typeofexports==='object'){//CommonJSfactory

1.CommonJS规范函数调用模式模块格式：hello.js'usestrict';vars='Hello';functiongreet(name){console.log(s+','+name+'!

文章目录webpack概念打包的场景为什么要打包在打包之外-翻译在打包之外-小动作课程重点模块化利用立即执行函数来改变`作用域`模块化的优点模块化方案的进化史AMD（成型比较早，应用不是很广泛）COMMONJSES6MODULEwebpack

ES6模块与CommonJS模块完全不同。它们有两个重大差异。

CommonJS与ES6module因为CommonJS的require语法是同步的，所以就导致了CommonJS模块规范只适合用在服务端，而ES6模块无论是在浏览器端还是服务端都是可以使用的，但是在服务端中

CommonJS就是为JS的表现来制定规范，因为js没有模块的功能所以CommonJS应运而生，它希望js可以在任何地方运行，不只是浏览器中。

1.ES6模块化1.1node.js中如何实现模块化node.js遵循了CommonJS的模块化规范。

1.ES6模块化1.1回顾：node.js中如何实现模块化node.js遵循了CommonJS的模块化规范。

node_server二、合法化包npminit随便起服务名，别花里胡哨的一路回车三、安装expressnpmiexpress成功安装四、server.js1、简单模拟后端请求//引入express（commonjs

13.ESModule和CommonJs区别14.js如何实现继承15.P

1.前言在开始阅读本文前，建议先阅读下面的两篇文章：【webpack学习笔记—1】3点弄懂CommonJS模块打包标准【webpack学习笔记—2】ES6模块打包标准2.依赖关系的动态与静态CommonJS

2.3loader2.4插件(plugin)2.5模式(mode)2.6浏览器兼容性(browsercompatibility)2.7环境(environment)三、模块系统的演进3.1原始方案3.2CommonJS3.3AMD3.4CMD3.5UMD3.6

前言随着我们的代码越来越庞大，我们需要拆分模块组合,便于后续的维护除了commonJS,es6.ts也是支持模块化的！️

//进入proto文件夹执行下列编译，将helloworld.proto替换为当前的.proto文件名protoc-I=.helloworld.proto\--js_out=import_style=commonjs

webpack:它主要的用途是通过CommonJS的语法把所有浏览器端需要发布的静态资源做相应的准备，比如资源的合并和打包vue-cli:用户生成Vue工程模板（帮你快速开始一个vue的项目，也就是给你一套

1.2包的加载机制Node.js中使用CommonJs模块

写在前面在node中支持两种模块方案——CommonJS（cjs）和ECMAScriptmodules(esm)。

个人主页：爱吃炫迈系列专栏：前端工程化‍座右铭：道阻且长，行则将至文章目录模块化的历史没有模块化带来的问题CommonJSCommonJS和Node关系模块化案例exports导出module.exports

包结构一个符合CommonJS规范的包，目录结构应该为：package.json:包的描述文件bin：用于存放可执行二进制文件的目录lib：用于存放Javascript代码的目录doc：用于存放文档的目录

谈谈你对webpack的看法说说你对AMD和Commonjs的理解常见web安全及防护原理用过哪些设计模式？为什么要有同源限制？of

这些加载器的使用也并不统一，产生了amd，commonjs，umd等等的规范，各有所长。直到es6的发布，js自身引入的模块机制，将会在以后逐渐被应用起来。

声明本篇内容摘抄自以下来源：Github:smyhvae/webJavaScript模块化开发的演进历程JavaScript模块化七日谈ES6:Module的加载实现CommonJS规范感谢各位大佬的分享

文章目录一、问题：vue3.0中引用jsencrypt加密库报错二、原因：jsencrypt库不支持es6ESmodule模块导出，vue3不支持commonjs导入导出三、解决：改配置文件四、具体使用一

webpack:它主要的用途是通过CommonJS的语法把所有浏览器端需要发布的静态资源做相应的准备，比如资源的合并和打包。vue-cli:用户生成Vue工程模板。

/images/bg.png';原因：首先webpack支持CommonJS、AMD和ES6模块打包。

一.AMDamd是requirejs在推广过程中对模块定义的规范化产出。define(['page/util'],function(util){functionfn1(){util.log('helloworld!');}return{fn1:fn1}})在定义一个函数的时候可以依赖其它的模块，是一种异步调用，也叫做依赖前置。(关于这块儿可以联想下vue项目中引入node_modules中的依赖)

常见的是CommonJS,AMD,CMD，ES6Module.CommonJS:javascript只支持在浏览器里执行，为了让js在服务器端也可以执行，CommonJSAPI定义了一些应用程序常用的一些功能的实现

1.webpack中的CommonJS和ESMudule规范1.1CommonJs规范CommonJs规范的出发点：JS没有模块系统、标准库较少、缺乏包管理工具；为了让JS可以在任何地方运行，以达到Java

/*项目选项*/"compilerOptions":{"target":"ES6",//目标语言的版本"module":"commonjs",//生成代码的模板标准"

CommonJS标准ECMAScript标准-默认导出和导入包的概念npm-软件包管理器npm-全局软件包node

概念：module.exports和exports是属于commonJs规范，export和exportdefault是ES6模块规范。