comment utiliser webpack à la charge de CDN ou fournisseur externe lib javascript dans le fichier js, pas dans le fichier html

Je suis à l'aide de réagir kit de démarrage pour le côté client de la programmation. Il utilise réagir et webpack. Pas de index.html ou tout code html à modifier, tous les fichiers js. Ma question est si je veux charger un fournisseur js lib dans le cloud, comment dois-je faire?

Il serait facile de le faire dans un fichier html. <script src="https://forio.com/tools/js-libs/1.5.0/epicenter.min.js"></script>

Toutefois, dans le fichier js, il n'utilise que la ngp les paquets installés. Comment puis-je importer les ci-dessus lib avec pas de fichier html? J'ai essayé d'importer et d'exiger, ils ne fonctionnent que pour les fichiers locaux.

mise à jour 10/21/15
Jusqu'à présent, j'ai essayé les deux directions, ce n'est pas l'idéal.

  1. @minheq oui, il y a un fichier html de tri de pour réagir kit de démarrage. Il est html.js src/composants/Html. Je peux mettre le cloud lib et toutes ses dépendances là comme ceci:
        <div id="app" dangerouslySetInnerHTML={{__html: this.props.body}} />
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
        <script src="https://forio.com/tools/js-libs/1.5.0/epicenter.min.js"></script>
        <script src="/app.js"></script>
        <script dangerouslySetInnerHTML={this.trackingCode()} />
    </body>

Bonne nouvelle, c'est qu'il fonctionne, je n'ai pas besoin de faire autre chose en js fichiers, aucune importation ou l'exigent. Cependant, maintenant, j'ai deux jquery libs chargé de différentes manières. Un ici, l'autre par le biais de mnp et webpack. Je me demande ça va me donner de la difficulté plus tard. La réaction de routage-je utiliser donnez-moi 'undefined variable' erreur si j'type a aucun chemin d'accès dans la fenêtre du navigateur en raison de la côté serveur de chargement, je suppose. Donc cette solution n'est pas très bonne.

  1. Utilisation webpack externes fonctionnalité. Ceci est documenté comme: lien. "Vous pouvez utiliser les options externes pour des applications aussi, lorsque vous souhaitez importer une API existante dans le bundle. I. e. vous souhaitez utiliser jquery à partir de CDN (séparé de la balise) et que vous voulez encore besoin("jquery") dans votre bundle. Il suffit de le préciser comme externe: { alias: { jquery: "jQuery" } }."
    Toutefois, la documentation, j'ai trouvé quelques endroits sont tous pointilleux sur la façon de le faire exactement. Jusqu'à présent, je n'ai aucune idée de comment l'utiliser pour remplacer <script src="https://forio.com/tools/js-libs/1.5.0/epicenter.min.js"></script> en html.
InformationsquelleAutor jay.m | 2015-10-21
  1. 0

    Il y a un fichier html qui est certainement utilisé pour servir les utilisateurs avec votre js bundle ci-joint. Probablement vous pouvez joindre la balise script dans le fichier html

    InformationsquelleAutor minheq
  2. 17

    externals n'est pas destiné à vous laisser faire cela. Il signifie "ne pas compiler cette ressource dans le dernier bundle parce que je vais l'inclure moi-même"

    Ce que vous avez besoin est un chargeur de script de mise en œuvre tels que script.js. J'ai aussi écrit une application simple de comparer les différents chargeur de script implémentations: lien.

    • C'est vrai, le externals propriété vous permet tout simplement de spécifier les ressources qui devraient être importé de l'environnement lors de l'exécution. Comment vous allez fournir la ressource externe au moment de l'exécution est laissé à vous, pas webpack.
    InformationsquelleAutor Tom Chen
  3. 14
    var $script = require("scriptjs");
$script("//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js", function() {
  $('body').html('It works!')
});
    InformationsquelleAutor Johnny
  4. 7

    Vous pouvez créer une balise script dans votre JS comme

    $("body").append($("<script src="https://forio.com/tools/js-libs/1.5.0/epicenter.min.js"></script>"))
    InformationsquelleAutor Jack Spektor
  5. 3

    Utilisation webpack est externals:

    externals vous permet de spécifier les dépendances de votre bibliothèque
    ce n'est pas résolu par webpack, mais deviennent des dépendances de la sortie. Cette
    signifie qu'ils sont importés de l'environnement au cours de l'exécution.

    InformationsquelleAutor Griffith