1.jsmodularnamespacecommonJSAMD/CMD/UMDES6module2.Namespace库名。分类名称。方法名称varNameSpace={}NameSpace.type=NameSpace.type||{}NameSpace.type.method=function(){}3.commonJS将一个文件标准化为一个模块，通过module.export暴露快速接口，通过require引入模块，同步执行commonJS文档示例：constRouter=require('./router/route')export=module.exports=createApplication;4.AMD规范AsyncModuleDefinition使用define定义模块使用require加载模块RequireJS依赖前端，提前执行AMD规范文档Example:define(//模块名称"alpha",//模块输出["require","exports","beta"],//模块导出函数(require,exports,beta){exports.verb=function(){returnbeta.verb();returnrequire("beta").verb();}})define(["a","b","c"],function(a,b,c){//相当于声明并初始化要使用的模块if(false){//即使没用去模块b，但是b还是提前执行了b.foo();}})五、CMDCommon模块定义一个文件定义一个模块usingdefineforamodule使用require加载一个模块SeaJSaslazyaspossible示例：//所有模块都由definedefine(function(require,exports,module){//通过require导入模块var$=require('jquery');varSpinning=require('./spinning');//通过exports提供对外接口exports.doSomething=//或者通过module.exports提供整个接口模块。exports=})六、UMDUniversalModule定义一般解决方案分三步：1.判断是否支持AMD2。判断是否支持CommonJS3。如果没有，使用全局变量示例：'){module.exports=factory();}else{root.returnExports=factory()}}(this,function(){return{}}))7.ESMesmascript模块一个文件，一个模块导出/导入示例：//加载模块的变量或方法importtheDefault,{named1,named2}from'src/mylib'importtheDefaultfrom'src/mylib'import{named1,named2}from'src/mylib'//导入模块和namenamed1asNamed1import{named1asmyNamed1}from'src/mylib'//加载模块中的所有变量Andmethodimport*asmylibfrom'src/mylib';//只加载，不做任何处理import'src/mylib'//定义一个模块，暴露接口exportvarname1="Bob";exportletname2="Bob";exportletNAME3="Bob";exportfunctionmyFunc(){}exportclassMyClass{}//可选地公开constUSERNAME="Bob";functionmyFunc(){}export{USERNAME,myFunc};export{USERNAMEasNAME,myFuncasFn};//从其他文件导入变量或方法，然后暴露出来export*from"src/other_module";export{foo,bar}from'src/other_module';export{fooasmyFoo,bar}from'src/other_module';export{fooasmyFoo,bar}from'src/other_module'八、webpack支持AMD(require)ESModules推荐CommonJS九、CSS模块化OOCSSSMACSSAtomicCSSMCSSACSSBEMCSSmodulesAtomicCSS每个class都是IndependentMCSSmulti-levelcssAMCSS为属性编写cssBEM：Block、Element、Modifier
