Wie vermeiden Sie, indem Sie die Abhängigkeiten, um config.js bei der Installation von JSPM plugins?

Wenn ich installieren Sie die css plugin mit dem folgenden Befehl:

jspm install css

Wird wie folgt ergänzt meine config.js:

System.config({
  "map": {
    "css": "github:systemjs/[email protected]",
    "github:jspm/[email protected]": {
      "assert": "npm:[email protected]"
    },
    "github:jspm/[email protected]": {
      "buffer": "npm:[email protected]"
    },
    "github:jspm/[email protected]": {
      "events-browserify": "npm:[email protected]"
    },
    "github:jspm/[email protected]": {
      "Base64": "npm:[email protected]",
      "events": "github:jspm/[email protected]",
      "inherits": "npm:[email protected]",
      "stream": "github:jspm/[email protected]",
      "url": "github:jspm/[email protected]",
      "util": "github:jspm/[email protected]"
    },
    "github:jspm/[email protected]": {
      "https-browserify": "npm:[email protected]"
    },
    "github:jspm/[email protected]": {
      "os-browserify": "npm:[email protected]"
    },
    "github:jspm/[email protected]": {
      "path-browserify": "npm:[email protected]"
    },
    "github:jspm/[email protected]": {
      "process": "npm:[email protected]"
    },
    "github:jspm/[email protected]": {
      "stream-browserify": "npm:[email protected]"
    },
    "github:jspm/[email protected]": {
      "url": "npm:[email protected]"
    },
    "github:jspm/[email protected]": {
      "util": "npm:[email protected]"
    },
    "github:systemjs/[email protected]": {
      "clean-css": "npm:[email protected]",
      "fs": "github:jspm/[email protected]",
      "path": "github:jspm/[email protected]"
    },
    "npm:[email protected]": {
      "fs": "github:jspm/[email protected]",
      "module": "github:jspm/[email protected]",
      "path": "github:jspm/[email protected]",
      "process": "github:jspm/[email protected]"
    },
    "npm:[email protected]": {
      "util": "npm:[email protected]"
    },
    "npm:[email protected]": {
      "base64-js": "npm:[email protected]",
      "ieee754": "npm:[email protected]",
      "is-array": "npm:[email protected]"
    },
    "npm:[email protected]": {
      "buffer": "github:jspm/[email protected]",
      "commander": "npm:[email protected]",
      "fs": "github:jspm/[email protected]",
      "http": "github:jspm/[email protected]",
      "https": "github:jspm/[email protected]",
      "os": "github:jspm/[email protected]",
      "path": "github:jspm/[email protected]",
      "process": "github:jspm/[email protected]",
      "source-map": "npm:[email protected]",
      "url": "github:jspm/[email protected]",
      "util": "github:jspm/[email protected]"
    },
    "npm:[email protected]": {
      "child_process": "github:jspm/[email protected]",
      "events": "github:jspm/[email protected]",
      "path": "github:jspm/[email protected]",
      "process": "github:jspm/[email protected]"
    },
    "npm:[email protected]": {
      "buffer": "github:jspm/[email protected]"
    },
    "npm:[email protected]": {
      "process": "github:jspm/[email protected]"
    },
    "npm:[email protected]": {
      "http": "github:jspm/[email protected]"
    },
    "npm:[email protected]": {
      "util": "github:jspm/[email protected]"
    },
    "npm:[email protected]": {
      "os": "github:jspm/[email protected]"
    },
    "npm:[email protected]": {
      "process": "github:jspm/[email protected]"
    },
    "npm:[email protected]": {
      "process": "github:jspm/[email protected]"
    },
    "npm:[email protected]": {
      "buffer": "github:jspm/[email protected]",
      "core-util-is": "npm:[email protected]",
      "events": "github:jspm/[email protected]",
      "inherits": "npm:[email protected]",
      "isarray": "npm:[email protected]",
      "process": "github:jspm/[email protected]",
      "stream": "npm:[email protected]",
      "string_decoder": "npm:[email protected]",
      "util": "github:jspm/[email protected]"
    },
    "npm:[email protected]": {
      "amdefine": "npm:[email protected]",
      "fs": "github:jspm/[email protected]",
      "path": "github:jspm/[email protected]",
      "process": "github:jspm/[email protected]"
    },
    "npm:[email protected]": {
      "events": "github:jspm/[email protected]",
      "inherits": "npm:[email protected]",
      "readable-stream": "npm:[email protected]"
    },
    "npm:[email protected]": {
      "buffer": "github:jspm/[email protected]"
    },
    "npm:[email protected]": {
      "assert": "github:jspm/[email protected]",
      "punycode": "npm:[email protected]",
      "querystring": "npm:[email protected]",
      "util": "github:jspm/[email protected]"
    },
    "npm:[email protected]": {
      "inherits": "npm:[email protected]",
      "process": "github:jspm/[email protected]"
    }
  }
});

Wie kann ich mein config.js sauber, um zu vermeiden, einschließlich all dies, all diese Informationen in alle meine Seiten (da config.js enthalten muss auf jeder Seite)?

Auch gibt es viele Abhängigkeiten deklariert config.js es bedeutet nicht, dass alle diese von der Anwendung geladen werden. System.js nur laden Sie die Abhängigkeiten, die Sie importieren (oder require()).
Danke @AdrianMitev. Ich weiß das, ich versuche nur zu vermeiden, einschließlich der 15-20kb auf jeder Seite (die Abhängigkeiten der Bibliotheken, die ich verwende)
Hinzufügen der richtigen cache-Header, sodass der browser nicht laden Sie es auf jeder Seite.
Ich bin schon zu tun. Der Punkt ist, zu vermeiden senden, dass ist nicht nötig zur Laufzeit. Diese Konfiguration ist nur dann relevant für die Entwicklung
Ich habe diese: github.com/jspm/jspm-cli/issues/652

InformationsquelleAutor Carlos Mendes | 2015-03-05

jspm

7

Ich bin neu JSPM zu und hatte eine ähnliche Reaktion über die große config.js Größen, aber hier ist ein paar Dinge, die ich gelernt habe:

1) ich würde nicht mit JSPM für Node Module, die Sie einsetzen möchten, auf der server-Seite /Entwicklungs-Maschine. Sie können einfach weiter zu verwenden, NPM für die. Ich habe diesen Fehler gemacht zu denken, dass ich verwenden soll JSPM für alle Abhängigkeiten, ersetzen beide Bower und NPM. Ich installierte gulp durch JSPM und meine config.js war plötzlich über 700 Zeilen lang!

2) ich fragte mich, ob es möglich war, es zu konfigurieren, zeichnen Sie einfach die top-level-Abhängigkeiten - wie im Paket.json - nicht alle Abhängigkeiten der Abhängigkeiten... Es klingt nicht wie es. Ich fragte in der Gitter-Gruppe und die Antwort war: "Groß ist, wie es ist, es gibt Ihnen die Kontrolle über peer-Abhängigkeiten, die Sie nicht im npm". (Dank Mitranim).

3) Wenn Sie vertraut sind mit require.js Sie können denken Sie an Ihre config.js als ein bisschen wie Ihre require.config(...). Eines der Dinge, die es tut, ist, richten Sie Ihre kurze Namen, die Sie verwenden können, um Ihre Module mit. Als ehemaliger require.js Benutzer, ich habe akzeptiert, dass ich brauchte, um meine require.js config-Datei auf dem front-end als Eingabe-Zeitpunkt, und es ist die gleiche für config.js - zumindest für die Entwicklung...

4) Produktion, ist eine andere Sache. Zitieren Kerl Bedford auf der Gitter-Gruppe: "die config-Datei nicht gemeint zu sein, eingeschlossen in der Produktion \ Arbeitsabläufe rund um die Entwicklung von". Es gibt mehr info im "Bundle für die Produktion" Abschnitt in der Getting-Started-guide.

5) fand ich einen nützlichen Ausgangspunkt ist Jack Franklin's demo von Async-Brighton. Besonders der Hinweis: er hat ein Bündel workflow für die Produktion, welche Optionen enthält das Skript zu zeigen, um den minified app.min.js - siehe Makefile.
- Ich nur installiert, css, jquery, semantic-ui, und meine Datei hat 1,743 Linien bereits.
- Haben Sie die npm-Modul für semantic-ui? , Das wird ziehen Sie in einer Reihe von anderen Knoten Module, wie z.B. Schluck-und alle sortiert... Sie wollen nur den integrierten CSS-und JS auf der client-Seite, richtig? Wie zu installieren wie hier: jspm installieren, semantic-ui=github:Semantic-Org/Semantic-UI (Das ist auf der github-repo, dass die bower-Paket bezieht)
- Auch wenn jemand, um es in die JSPM-Registrierung (github.com/jspm/registry), dann das nächste mal könnte man nur tun jspm install semantic-ui
- Verwendet habe ich: jspm installieren npm:semantic-ui -o "{ 'Verzeichnisse': { 'lib': 'dist' }, main: 'semantischen', 'shim': { 'semantischen': { 'deps': 'jquery' } } }"
InformationsquelleAutor poshaughnessy

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.