So verweisen Sie auf den minimierten Code, aber entwickeln Sie weiter in JavaScript

Question

Unsere index.html bezieht sich auf etwa 25 Javascript-Dateien. Für die Bereitstellung müssen wir alle diese minimieren, daher müssen wir unsere index.html-Verweise auf die verkleinerten Versionen aktualisieren.

Wenn wir zurück zur Entwicklung gehen, müssen wir eine ähnliche index.html Datei verwenden, aber Verweise auf nicht-minimierte Javascript-Dateien machen. Gibt es einen Best-Practice-Weg, um dies zu erreichen, ohne zwei index.html-Dateien synchron halten zu müssen, eine für die Entwicklung und eine für die Bereitstellung?

Answer 1

Die Antwort ist Source Maps, es ist im Grunde eine Möglichkeit, eine minimierte Javascript-Datei auf einen unbebauten Zustand zurück zu verweisen.

Auf diese Weise brauchen Sie nur eine index.html Datei, die auf Ihre minimierte Javascript-Datei verweist, und die Quellkarten helfen Ihnen, sie zu debuggen, als wären sie nicht minimiert.

Hier ist ein Link, der mir wirklich geholfen hat.

http://www.html5rocks.com/en/tutorials/developertools/sourcemaps/

Sie können auch Tools wie gulp oder grunt verwenden, um Verkleinerungs zu machen und die Quelle Aufbau abbildet einfacher.