2016-05-03 8 views
13

ich einen Dienst in meiner angular Anwendung bin mit uibModal zu erstellen, wieKritische Abhängigkeiten - die Anforderung einer Abhängigkeit ist ein Ausdruck Webpack

function modal(modalConfig){ 
        var modalInstance = $uibModal.open({ 
        animation: true, 
        template: require("../a/b/xyz.html"), 
        controller: modalConfig.controller, 
        size: modalConfig.size, 
        controllerAs: modalConfig.controllerAs, 
        bindToController : true, 
        resolve: modalConfig.resolveObj 

       }); 
      } 

folgt Bitte beachten Sie die Linie

template: require("../a/b/xyz.html"), 

Ich möchte Verwenden Sie eine Variable an dieser Stelle

template: require(modalConfig.templateUrl), 

aber wenn ich eine Variable anstelle von harten codierten Wert verwenden webpack gibt mir

Critical dependencies: 
83:22-54 the request of a dependency is an expression 

ich nicht in der Lage bin, diesen Fehler zu beheben. Was kann der mögliche Grund dafür sein?

Ich habe node-express Server für kontinuierliche webpack Builds verwendet. Ich habe mir auch andere Antworten angesehen, aber sie haben meine Anfrage nicht gelöst.

Antwort

14

Nach viel getroffen und Versuch fand die solution.What ich habe, ist dies:

template: require("../../scripts" + modalConfig.templateUrl + ".html") 

Annahmen

  1. Stammordner unter dem alle Datei scripts
  2. und der relative Pfad ist kommt dieses Ordners aus der Datei, in die die Funktion geschrieben wird, lautet ../../scripts.
  3. ../../scripts + modalConfig.templateUrl + ".html" bilden den korrekten Pfad für die zu verwendende Datei.

Pflicht Hinweis

  1. immer etwas fest codierten Pfad des Root-Ordner schreiben. Setze es nicht in Variable ein. so wird dies nicht funktionieren

    var context = "../../scripts" ; template: require(context + modalConfig.templateUrl + ".html")

Der Basispfad (wie in einem Teil des eigentlichen Pfad) für Basisreferenz fest einprogrammiert werden muss, wie in es webpack hilft eine Liste aller zu erstellen die Module, die für die Dynamik benötigt werden, benötigen.

Grund (von webpack docs), lesen Sie dynamic requires und context module.

+1

Sparte mich eine Tonne Zeit. Vielen Dank! –

Verwandte Themen