web-dev-qa-db-fra.com

Importation Javascript ES6 sans nom

J'utilise Webpack, Babel et Vue.js et je souhaite diviser mon fichier d'entrée. J'ai actuellement un fichier app.js qui est le point de départ de mon application.

J'ai quelques morceaux de code que je veux mettre dans un bootstrap.js fichier que je souhaite inclure dans mon principal app.js fichier puis-je avoir un fichier propre pour commencer avec Vue et y ajouter des composants au fur et à mesure.

Quelques exemples de ce que je voudrais mettre dans mon bootstrap.js fichier:

import messagesNL from './translations/nl';

Vue.use(VeeValidate, {
  locale: 'nl',
  dictionary: {
    nl: {
      messages: messagesNL
    }
  }
});

window.Vue = Vue;

Donc, à peu près la configuration des plugins, la configuration globale, etc. Je pense que ce n'est pas votre module typique et j'ai du mal à créer une structure de type module pour ce fichier, donc je l'utilise essentiellement dans mon app.js fichier:

import bootstrap from './bootstrap';

N'ayant aucune idée si cela fonctionnerait, il semble tout simplement importer correctement sans que j'aie fait un module exports {} comme la syntaxe.

Maintenant, la variable bootstrap que j'ai affectée à ce fichier n'est pas utilisée dans app.js car il n'est utilisé que pour exiger le fichier et mon IDE sorte de "gris" pour me faire savoir qu'il n'est pas utilisé.

Existe-t-il une autre syntaxe pour cela afin que je n'ai pas à lui attribuer de nom? Cette approche est-elle acceptable pour diviser mon fichier, ou devrais-je faire autre chose?

Je ne l'ai pas encore mis dans un module approprié car il aurait alors sa propre portée locale et je ne serais pas sûr de savoir comment configurer Vue avec tous les plugins, etc. Si quelqu'un a un meilleure suggestion, je suis ouvert à elle.

À votre santé.

javascriptnode.jswebpackecmascript-6vue.js
17
Stephan-v

Pour inclure un fichier sans importer quoi que ce soit, vous pouvez simplement supprimer le <name> from partie de la déclaration:

import './bootstrap';

Cela exécutera le module cible sans affecter la portée du module actif, mais cela peut avoir des effets secondaires tels que la déclaration de globaux ou la modification de globaux existants.

Comme indiqué dans les documents MDN pour Importer un module pour ses effets secondaires uniquement :

Importez un module entier pour les effets secondaires uniquement, sans rien importer. Cela exécute le code global du module, mais n'importe réellement aucune valeur.

import '/modules/my-module.js';
37
sdgluck