Salida de un módulo ES usando webpack

En primer lugar me gustaría señalar la diferencia entre el commonJS y commonJS2

CommonJS no soporta el uso de module.exports = function() {} que es usado por node.js y muchas otras implementaciones commonJS.

Webpack2 emplea el concepto de la agrupación del código de la biblioteca y para el uso generalizado de la misma y para hacerlo compatible de trabajar en diferentes entornos utilizamos la optionlibraryTarget opción

Ahora la parte aquí responderá tanto a su preguntas

Las posibles opciones de biblioteca soportadas en webpack2 son

• libraryTarget: "umd", // enum
• libraryTarget: "umd-module", // ES2015 module wrapped in UMD
• libraryTarget: "commonjs-module", // ES2015 module wrapped in CommonJS
• libraryTarget: "commonjs2", // exported with module.exports
• libraryTarget: "commonjs", // exported as properties to exports
• libraryTarget: "amd", // defined with AMD defined method
• libraryTarget: "this", // property set on this
• libraryTarget: "var", // variable defined in root scope

Interlop tiene el siguiente significado

Para fomentar el uso de CommonJS y módulos ES6 , al exportar un default export sin ningún otro exports module.exports se establecerá además de exports["default"] como se muestra en el siguiente ejemplo

export default test;
exports["default"] = test;
module.exports = exports["default"];

Así que, básicamente, significa que el commonJS-module puede ser utilizado por exponer como module.exports mediante la interloping con ES2015 módulo envuelto en commonJS

Más información sobre el interloping se puede encontrar en este blogpost y el stackoverflow enlace a él.

La idea básica está en ES6 las propiedades de exportación e importación en tiempo de ejecución no se pueden cambiar commonJS esto funciona bien como el requerir cambios ocurren en tiempo de ejecución por lo tanto tiene ES2015 es entrelazado con el CommonJS.

Update

Webpack 2 da la opción de crear la biblioteca que se puede agrupar e incluir .

Si desea que su módulo se utilice en diferentes entornos , puede agruparlo como una biblioteca agregando las opciones de biblioteca y enviarlo a su entorno específico. Procedimiento mencionado en los documentos .

Otro ejemplo sencillo sobre cómo usar commonjs-module

Un punto importante a tener en cuenta aquí es babel agrega exports.__esModule = true a cada es6 module y al importarlo llama a _interopRequire para verificar esa propiedad.

__esModule = true necesita ser configurado solo en exportación de biblioteca. Debe configurarse en el exports del módulo de entrada . Los módulos internos no necesitan __esModule, es solo un truco de babel.

Como se menciona en los documentos

__esModule se define (está enhebrado como ES2015 Módulo en modo interop)

Uso como se menciona en los casos de prueba

export * from "./a";
export default "default-value";
export var b = "b";

import d from "library";
import { a, b } from "library";