1.CommonJS

  CommonJS是一种被广泛使用的JavaScript模块化规范,其核心思想是用过require方法来同步加载依赖的其他模块,通过moudle.exports导出需要暴露的接口,Node.js也采用了这种方式。

  采用CommonJS导入及导出的代码如下:

  示例:  // 导入

      const moduleA = require('./moduleA');

      // 导出

      module.exports = moduleA.someFunc;

  优点:

    1.代码可复用与Node.js环境下并运行,例如做同构应用;

    2.通过Npm发布的很多第三方模块都采用了CommonJS规范;     

  缺点:

    1.这样的代码无法直接运行在浏览器环境下,必须通过工具转换成标准的ES5。

  

  CommonJS还可以细分为CommonJS1和CommonJS2,区别在于CommonJS1只能通过exports.XX = XX 的方式导出,而CommonJS 2 通过module.exports = XX 的方式导出;

深入浅出webpack笔记的更多相关文章

  1. 【读书笔记】《深入浅出Webpack》

    Webpack版本 分析版本为3.6.0 4.0为最近升级的版本,与之前版本变化较大,编译输出的文件与3.0版本会不一致,目前项目中使用的版本3.0版本,所以基于3.0版本进行分析学习. Webpac ...

  2. [js高手之路]深入浅出webpack系列2-配置文件webpack.config.js详解

    接着上文,重新在webpack文件夹下面新建一个项目文件夹demo2,然后用npm init --yes初始化项目的package.json配置文件,然后安装webpack( npm install ...

  3. [js高手之路]深入浅出webpack教程系列6-插件使用之html-webpack-plugin配置(下)

    上文我们对html-webpack-plugin的实例htmlWebpackPlugin进行了遍历分析,讲解了几个常用属性( inject, minify )以及自定义属性的添加,本文,我们继续深入他 ...

  4. [js高手之路]深入浅出webpack教程系列5-插件使用之html-webpack-plugin配置(中)

    上文我们讲到了options的配置和获取数据的方式,本文,我们继续深入options的配置 一.html-webpack-plugin插件中的options除了自己定义了一些基本配置外,我们是可以任意 ...

  5. [js高手之路]深入浅出webpack教程系列4-插件使用之html-webpack-plugin配置(上)

    还记得我们上文中的index.html文件吗? 那里面的script标签还是写死的index.bundle.js文件,那么怎么把他们变成动态的index.html文件,这个动态生成的index.htm ...

  6. [js高手之路]深入浅出webpack教程系列3-配置文件webpack.config.js详解(下)

    本文继续接着上文,继续写下webpack.config.js的其他配置用法. 一.把两个文件打包成一个,entry怎么配置? 在上文中的webpack.dev.config.js中,用数组配置entr ...

  7. [js高手之路]深入浅出webpack教程系列7-( babel-loader,css-loader,style-loader)的用法

    什么是loader呢,官方解释为文件的预处理器,通俗点说webpack在处理静态资源的时候,需要加载各种loader,比如,html文件,要用html-loader, css文件要用css-loade ...

  8. [js高手之路]深入浅出webpack教程系列9-打包图片(file-loader)用法

    我们还是接着上文继续,本文我们要讲的是图片资源的打包,图片在静态排版中,经常出现的两个位置是css通过background引入背景,还有一种就是在html模板文件中用img标签引入的方式,如果要在we ...

  9. [js高手之路]深入浅出webpack教程系列8-(postcss-loader,autoprefixer,html-loader,less-loader,ejs-loader)用法

    我们接着上文,那么在上篇文章的最后,写到了css-loader的用法,如果你用心发现,就能看到我在style.css样式文件中写了一个这样的样式: div { transition: all ease ...

随机推荐

  1. “GANs”与“ODEs”:数学建模的终结?

    在本文中,我想将经典数学建模和机器学习之间建立联系,它们以完全不同的方式模拟身边的对象和过程.虽然数学家基于他们的专业知识和对世界的理解来创建模型,而机器学习算法以某种隐蔽的不完全理解的方式描述世界, ...

  2. coding++:error Could not read JSON: Unexpected token (START_OBJECT), expected START_ARRAY: need JSON Array to contain As.WRAPPER_ARRAY type information for class java.lang.Object

    Spring源码中是使用容器中的ObjectMapper对象进行序列化和反序列化. 当我们将自定义的ObjectMapper对象放入IOC容器中后,会自动覆盖SpringBoot自动装载的Object ...

  3. IOS 常用的宏定义(#define)

    开发中经常用到的常量定义(随时更行): 与UIView相关 //获取View的frame属性 #define GetViewWidth(view) view.frame.size.width #def ...

  4. Django安装和使用

    Django安装 安装Django Python3在线安装Django pip3 install Django 验证是否安装成功,并查看当前版本 python -m django --version ...

  5. 模块 schedule 定时任务

    schedule模块实现定时任务 2018-08-29 15:01:51 更多 一.官方示例 import schedule import time def job(): print("I' ...

  6. elasticsearch报Fielddata is disabled on text fields by default

    我刚玩elk没几天,今天启动kibana之后执行查询看见elasticsearch报了一个错误 Caused by: java.lang.IllegalArgumentException: Field ...

  7. centos7中安装redis

    http://www.open-open.com/lib/view/open1426468117367.html https://www.cnblogs.com/cndavidwang/p/64294 ...

  8. [讲解]prim算法<最小生成树>

    最小生成树的方法一般比较常用的就是kruskal和prim算法 一个是按边从小到大加,一个是按点从小到大加,两个方法都是比较常用的,都不是很难... kruskal算法在本文里我就不讲了,本文的重点是 ...

  9. Material Design 组件之NavigationView

    今天来看一下 NavigationView 的使用,NavigationView 是一个标准的导航菜单,其菜单内容由菜单资源文件来填充,NavigationView 一般和 DrawerLayout ...

  10. B 雷诺与奴隶主

    时间限制 : 5000 MS   空间限制 : 524288 KB 问题描述 自从周文武老师在班上吹嘘了"录试"这款游戏之后,PHD同学沉迷于其中无法自拔. "录试&qu ...