Dans les modules CJS, j'utiliserais export
et var plugin = require("plugin");
exporter / importer
Dans les modules ES6, j'utiliserais export
et import * as plugin from "plugin";
exporter / importer.
Y a-t-il plus de différences de syntaxe? Ces différences sont-elles correctes?
Qu'est ce que export default
et export *
?
Réponses:
6 pour la réponse № 1Les modules CommonJS et ES6 sont assez similaires, mais ils ont des différences très importantes à prendre en compte. Pour répondre directement à votre question:
var plugin = require("plugin");
dans ES6 serait équivalent à la fois
// Import all named exports of "plugin".
import * as plugin from "plugin";
et / ou
// Import default export of "plugin".
import plugin from "plugin";
// an alias of
import {default as plugin} from "plugin";
mais cela dépend de la façon dont le "plugin" a été écrit et s'il a été écrit avec ES6 export
ou CommonJS module.exports
.
Les importations CommonJS ne comportent qu'un seul objet exporté. Cet objet peut être une fonction, ou un objet, ou autre chose. Généralement, les modules CommonJS font
exports.foo = ...;
exports.bar = ...;
exporter des propriétés nommées. Ils peuvent également exporter un objet "par défaut" en tant que
module.exports = function(){};
La chose fondamentale ici est que si vous voulez une exportation par défaut ET des exportations nommées, votre seule option est de placer les propriétés directement sur l’exportation par défaut.
Modules ES6
Pour les modules ES6, les concepts d'exportations nommées et d'exportations par défaut sont séparés à 100%. par exemple.
export var foo = ...;
export var bar = ...;
export default function fn(){};
La principale différence étant que
fn.foo !== foo;
Avec cet exemple alors, il y a deux cas
Plugin utilisé ES6 export
import * as plugin from "plugin";
plugin.foo === ...;
plugin.bar === ...;
typeof plugin === "object";
import plugin from "plugin";
plugin.foo === undefined;
plugin.bar === undefined;
typeof plugin === "function";
Plugin utilisé CommonJS module.exports
import * as plugin from "plugin";
plugin.foo === ...;
plugin.bar === ...;
typeof plugin === "object";
import plugin from "plugin";
plugin.foo === ...;
plugin.bar === ...;
typeof plugin === "function";
Live Binding import / export
L’autre principale différence dans votre exemple est que plugin
est une liaison en direct. Cela signifie que s'il est mis à jour ultérieurement dans le module, il se mettra à jour dans votre importation, par exemple.
// plugin.js
export var foo = "foo";
export function update(){
foo = "bar";
}
// other.js
import {foo, update} from "plugin";
foo === "foo";
update();
foo === "bar"
et ce ne serait pas le cas si vous avez
var foo = require("plugin").foo;
var update = require("plugin").update;