Fantastisches Community-Modul

UglifyJS 3

UglifyJS ist ein JavaScript-Toolkit für Parser, Minifier, Kompressor und Verschönerer.

Hinweis:

  • uglify-js@3 verfügt über eine vereinfachte API und CLI , die nicht abwärtskompatibel mit uglify-js@2 .
  • Die Dokumentation zu UglifyJS 2.x Versionen finden Sie hier .
  • uglify-js unterstützt nur JavaScript (ECMAScript 5).
  • To minify ECMAScript 2015 or above , transpilieren Sie mit Tools wie Babel .

Installieren

Stellen Sie zunächst sicher, dass Sie die neueste Version von node.js installiert haben (möglicherweise müssen Sie Ihren Computer nach diesem Schritt neu starten).

Von NPM zur Verwendung als Befehlszeilen-App:

1
npm install uglify-js -g

Von NPM zur programmatischen Verwendung:

1
npm install uglify-js

Befehlszeilenverwendung

1
uglifyjs [input files] [options]

UglifyJS kann mehrere Eingabedateien aufnehmen. Es wird empfohlen, zuerst die Eingabedateien und dann die Optionen zu übergeben. UglifyJS analysiert die Eingabedateien nacheinander und wendet alle Komprimierungsoptionen an. Die Dateien werden im selben globalen Bereich analysiert, dh als Referenz von einer Datei zu einer Variablen / Funktion, die in einer anderen Datei deklariert ist, wird ordnungsgemäß abgeglichen.

Wenn keine Eingabedatei angegeben ist, liest UglifyJS aus STDIN.

Wenn Sie Ihre Optionen vor den Eingabedateien übergeben möchten, trennen Sie die beiden durch einen doppelten Bindestrich, um zu verhindern, dass Eingabedateien als Optionsargumente verwendet werden:

1
uglifyjs --compress --mangle -- input.js

Command line options

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92
-h, --help Print usage information. `--help options` for details on available options. -V, --version Print version number. -p, --parse <options> Specify parser options: `acorn` Use Acorn for parsing. `bare_returns` Allow return outside of functions. Useful when minifying CommonJS modules and Userscripts that may be anonymous function wrapped (IIFE) by the .user.js engine `caller`. `expression` Parse a single expression, rather than a program (for parsing JSON). `spidermonkey` Assume input files are SpiderMonkey AST format (as JSON). -c, --compress [options] Enable compressor/specify compressor options: `pure_funcs` List of functions that can be safely removed when their return values are not used. -m, --mangle [options] Mangle names/specify mangler options: `reserved` List of names that should not be mangled. --mangle-props [options] Mangle properties/specify mangler options: `builtins` Mangle property names that overlaps with standard JavaScript globals. `debug` Add debug prefix and suffix. `domprops` Mangle property names that overlaps with DOM properties. `keep_quoted` Only mangle unquoted properties. `regex` Only mangle matched property names. `reserved` List of names that should not be mangled. -b, --beautify [options] Beautify output/specify output options: `beautify` Enabled with `--beautify` by default. `preamble` Preamble to prepend to the output. You can use this to insert a comment, for example for licensing information. This will not be parsed, but the source map will adjust for its presence. `quote_style` Quote style: 0 - auto 1 - single 2 - double 3 - original `wrap_iife` Wrap IIFEs in parenthesis. Note: you may want to disable `negate_iife` under compressor options. -o, --output <file> Output file path (default STDOUT). Specify `ast` or `spidermonkey` to write UglifyJS or SpiderMonkey AST as JSON to STDOUT respectively. --comments [filter] Preserve copyright comments in the output. By default this works like Google Closure, keeping JSDoc-style comments that contain "@license" or "@preserve". You can optionally pass one of the following arguments to this flag: - "all" to keep all comments - a valid JS RegExp like `/foo/` or `/^!/` to keep only matching comments. Note that currently not *all* comments can be kept when compression is on, because of dead code removal or cascading statements into sequences. --config-file <file> Read `minify()` options from JSON file. -d, --define <expr>[=value] Global definitions. --ie8 Support non-standard Internet Explorer 8. Equivalent to setting `ie8: true` in `minify()` for `compress`, `mangle` and `output` options. By default UglifyJS will not try to be IE-proof. --keep-fnames Do not mangle/drop function names. Useful for code relying on Function.prototype.name. --name-cache <file> File to hold mangled name mappings. --self Build UglifyJS as a library (implies --wrap UglifyJS) --source-map [options] Enable source map/specify source map options: `base` Path to compute relative paths from input files. `content` Input source map, useful if you're compressing JS that was generated from some other original code. Specify "inline" if the source map is included within the sources. `filename` Name and/or location of the output source. `includeSources` Pass this flag if you want to include the content of source files in the source map as sourcesContent property. `root` Path to the original source to be included in the source map. `url` If specified, path to the source map to append in `//# sourceMappingURL`. --timings Display operations run time on STDERR. --toplevel Compress and/or mangle variables in top level scope. --verbose Print diagnostic messages. --warn Print warning messages. --wrap <name> Embed everything in a big function, making the “exports” and “global” variables available. You need to pass an argument to this option to specify the name that your module will take when included in, say, a browser.

--output ( -o ) an, um die Ausgabedatei zu deklarieren. Andernfalls geht die Ausgabe an STDOUT.

CLI-Quellkartenoptionen

UglifyJS kann eine Quellzuordnungsdatei generieren, die zum Debuggen Ihres komprimierten JavaScript sehr nützlich ist. Um eine --source-map --output output.js zu erhalten, übergeben Sie --source-map --output output.js (die --source-map --output output.js wird in output.js.map ) .

Zusätzliche Optionen:

  • --source-map "filename='<NAME>'" , um den Namen der --source-map "filename='<NAME>'" anzugeben.

  • --source-map "root='<URL>'" , um die URL zu übergeben, unter der sich die Originaldateien befinden.

  • --source-map "url='<URL>'" , um die URL anzugeben, unter der sich die X-SourceMap befindet. Andernfalls geht UglifyJS davon aus, dass HTTP X-SourceMap wird, und lässt die Anweisung //# sourceMappingURL= .

Zum Beispiel:

1 2 3
uglifyjs js/file1.js js/file2.js \ -o foo.min.js -c -m \ --source-map "root='http://foo.com/src',url='foo.min.js.map'"

Das Obige komprimiert und file1.js und file2.js , file2.js die Ausgabe in foo.min.js und die foo.min.js.map in foo.min.js.map . Die foo.min.js.map bezieht sich auf http://foo.com/src/js/file1.js und http://foo.com/src/js/file2.js (tatsächlich werden http://foo.com/src als http://foo.com/src/js/file1.js und die Originaldateien als aufgeführt js/file1.js und js/file2.js ).

Composed source map

Wenn Sie JS-Code komprimieren, der von einem Compiler wie CoffeeScript ausgegeben wurde, ist die Zuordnung zum JS-Code nicht allzu hilfreich. Stattdessen möchten Sie den ursprünglichen Code (z. B. CoffeeScript) wieder zuordnen. UglifyJS verfügt über eine Option zum Erstellen einer Eingabequellenzuordnung. Angenommen, Sie haben eine Zuordnung von CoffeeScript → kompiliertem JS, kann UglifyJS eine Zuordnung von CoffeeScript → komprimiertem JS generieren, indem jedes Token im kompilierten JS seinem ursprünglichen Speicherort zugeordnet wird.

Um diese Funktion zu verwenden, übergeben Sie --source-map "content='/path/to/input/source.map'" oder --source-map "content=inline" wenn die --source-map "content=inline" inline mit den Quellen enthalten ist.

CLI-Komprimierungsoptionen

Sie müssen --compress ( -c ) übergeben, um den Kompressor zu aktivieren. Optional können Sie eine durch Kommas getrennte Liste von Komprimierungsoptionen übergeben .

Optionen haben die Form foo=bar oder nur foo (letzteres impliziert eine boolesche Option, die Sie auf true setzen möchten; es ist effektiv eine Verknüpfung für foo=true ).

Beispiel:

1
uglifyjs file.js -c toplevel,sequences=false

CLI-Mangle-Optionen

Um den Mangler zu aktivieren, müssen Sie --mangle ( -m ) übergeben. Die folgenden (durch Kommas getrennten) Optionen werden unterstützt:

  • toplevel (Standardwert false ) -Mangle-Namen, die im Bereich der obersten Ebene deklariert wurden.

  • eval (Standardwert false ) - Namen, die in Bereichen sichtbar sind, in denen eval oder with verwendet werden.

Wenn das Mangeln aktiviert ist, Sie jedoch verhindern möchten, dass bestimmte Namen --mangle reserved , können Sie diese Namen mit --mangle reserved deklarieren und eine durch Kommas getrennte Liste von Namen übergeben. Beispiel:

1
uglifyjs ... -m reserved=['$','require','exports']

Um zu verhindern, dass die require geändert werden, werden exports und $ -Namen geändert.

Namen von CLI-Mangling-Eigenschaften ( --mangle-props )

Hinweis: Dies wird wahrscheinlich Ihren Code unterbrechen. Das Mangeln von Eigenschaftsnamen ist ein separater Schritt, der sich vom Mangeln von Variablennamen unterscheidet. --mangle-props Sie --mangle-props , um dies zu aktivieren. Es werden alle Eigenschaften im Eingabecode mit Ausnahme der integrierten DOM-Eigenschaften --mangle-props und Eigenschaften in JavaScript-Kernklassen. Zum Beispiel:

1 2 3 4 5 6 7 8 9 10 11
// example.js var x = { baz_: 0, foo_: 1, calc: function() { return this.foo_ + this.baz_; } }; x.bar_ = 2; x["baz_"] = 3; console.log(x.calc());

Alle Eigenschaften Zerfleischen (die mit Ausnahme von JavaScript builtins ):

1
$ uglifyjs example.js -c -m --mangle-props
1
var x={o:0,_:1,l:function(){return this._+this.o}};x.t=2,x.o=3,console.log(x.l());

Alle Eigenschaften außer reserved Eigenschaften entstellen:

1
$ uglifyjs example.js -c -m --mangle-props reserved=[foo_,bar_]
1
var x={o:0,foo_:1,_:function(){return this.foo_+this.o}};x.bar_=2,x.o=3,console.log(x._());

Alle Eigenschaften passend A Zerfleischen regex :

1
$ uglifyjs example.js -c -m --mangle-props regex=/_$/
1
var x={o:0,_:1,calc:function(){return this._+this.o}};x.l=2,x.o=3,console.log(x.calc());

Kombinieren von Optionen für Mangeleigenschaften:

1
$ uglifyjs example.js -c -m --mangle-props regex=/_$/,reserved=[bar_]
1
var x={o:0,_:1,calc:function(){return this._+this.o}};x.bar_=2,x.o=3,console.log(x.calc());

Damit dies von Nutzen ist, vermeiden wir standardmäßig das --mangle-props builtins von Standard-JS-Namen ( --mangle-props builtins zum Überschreiben).

In tools/domprops.json eine Standardausschlussdatei bereitgestellt, die die meisten in verschiedenen Browsern definierten Standard-JS- und DOM-Eigenschaften tools/domprops.json sollte. --mangle-props domprops , um diese Funktion zu deaktivieren.

Mit einem regulären Ausdruck kann definiert werden, welche Eigenschaftsnamen --mangle-props regex=/^_/ werden sollen. Beispielsweise werden mit --mangle-props regex=/^_/ nur Eigenschaftsnamen --mangle-props regex=/^_/ , die mit einem Unterstrich beginnen.

Wenn Sie mehrere Dateien mit dieser Option komprimieren, müssen wir sicherstellen, dass eine Eigenschaft in allen --name-cache filename.json auf denselben Namen --name-cache filename.json sie am Ende zusammenarbeiten. --name-cache filename.json Sie dazu --name-cache filename.json und UglifyJS verwaltet diese Zuordnungen in einer Datei, die dann wiederverwendet werden kann. Sie sollte anfangs leer sein. Beispiel:

1 2 3
$ rm -f /tmp/cache.json # start fresh $ uglifyjs file1.js file2.js --mangle-props --name-cache /tmp/cache.json -o part1.js $ uglifyjs file3.js file4.js --mangle-props --name-cache /tmp/cache.json -o part2.js

Jetzt sind part1.js und part2.js in Bezug auf verstümmelte Eigenschaftsnamen miteinander konsistent.

Die Verwendung des Namenscaches ist nicht erforderlich, wenn Sie alle Ihre Dateien in einem einzigen Aufruf von UglifyJS komprimieren.

--mangle-props keep_quoted Namen --mangle-props keep_quoted ( --mangle-props keep_quoted )

Bei Verwendung des in Anführungszeichen gesetzten Eigenschaftsnamens ( o["foo"] ) wird der Eigenschaftsname ( foo ) so reserviert, dass er nicht im gesamten Skript o.foo selbst wenn er in einem nicht in o.foo Stil ( o.foo ) verwendet wird. Beispiel:

1 2 3 4 5 6 7
// stuff.js var o = { "foo": 1, bar: 3 }; o.foo += o.bar; console.log(o.foo);
1
$ uglifyjs stuff.js --mangle-props keep_quoted -c -m
1
var o={foo:1,o:3};o.foo+=o.o,console.log(o.foo);

Debugging property name mangling

Sie können auch das --mangle-props debug Eigenschaftsnamen zu o.foo ohne sie vollständig zu verdecken. Beispielsweise würde die Eigenschaft o.foo mit dieser Option zu o._$foo$_ . Dies ermöglicht das o._$foo$_ Eigenschaften einer großen Codebasis während Sie immer noch in der Lage sind, den Code zu debuggen und festzustellen, wo Mangeln die Dinge kaputt macht.

1
$ uglifyjs stuff.js --mangle-props debug -c -m
1
var o={_$foo$_:1,_$bar$_:3};o._$foo$_+=o._$bar$_,console.log(o._$foo$_);

Sie können ein benutzerdefiniertes Suffix auch mit --mangle-props debug=XYZ . Dies würde dann o.foo in o._$foo$XYZ_ . Sie können dies jedes Mal ändern, wenn Sie ein Skript kompilieren, um festzustellen, wie eine Eigenschaft beschädigt wurde Eine Technik besteht darin, bei jeder Kompilierung eine Zufallszahl zu übergeben, um das Ändern von Mangeln mit verschiedenen Eingaben zu simulieren (z. B. wenn Sie das Eingabeskript mit neuen Eigenschaften aktualisieren) und um Fehler wie das Schreiben von beschädigten Schlüsseln in den Speicher zu identifizieren.

API-Referenz

Unter der Annahme einer Installation über NPM können Sie UglifyJS wie folgt in Ihre Anwendung laden:

1
var UglifyJS = require("uglify-js");

Ist eine einzige High Level gibt Funktion, minify(code, options) , die Verkleinerungs Alle Perform Werden Phasen in einer konfigurierbaren Weise durch Standard. minify() werden die Optionen ermöglichen compress und mangle Beispiel .:

1 2 3 4
var code = "function add(first, second) { return first + second; }"; var result = UglifyJS.minify(code); console.log(result.error); // runtime error, or `undefined` if no error console.log(result.code); // minified output: function add(n,d){return n+d}

Sie können mehr als eine JavaScript-Datei gleichzeitig minify indem Sie ein Objekt für das erste Argument verwenden, bei dem die Schlüssel Dateinamen und die Werte Quellcode sind:

1 2 3 4 5 6 7
var code = { "file1.js": "function add(first, second) { return first + second; }", "file2.js": "console.log(add(1 + 2, 3 + 4));" }; var result = UglifyJS.minify(code); console.log(result.code); // function add(d,n){return d+n}console.log(add(3,7));

Die toplevel Option:

1 2 3 4 5 6 7 8
var code = { "file1.js": "function add(first, second) { return first + second; }", "file2.js": "console.log(add(1 + 2, 3 + 4));" }; var options = { toplevel: true }; var result = UglifyJS.minify(code, options); console.log(result.code); // console.log(3+7);

Die nameCache Option:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16
var options = { mangle: { toplevel: true, }, nameCache: {} }; var result1 = UglifyJS.minify({ "file1.js": "function add(first, second) { return first + second; }" }, options); var result2 = UglifyJS.minify({ "file2.js": "console.log(add(1 + 2, 3 + 4));" }, options); console.log(result1.code); // function n(n,r){return n+r} console.log(result2.code); // console.log(n(3,7));

Sie können den Namenscache auf folgende Weise im Dateisystem beibehalten:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16
var cacheFileName = "/tmp/cache.json"; var options = { mangle: { properties: true, }, nameCache: JSON.parse(fs.readFileSync(cacheFileName, "utf8")) }; fs.writeFileSync("part1.js", UglifyJS.minify({ "file1.js": fs.readFileSync("file1.js", "utf8"), "file2.js": fs.readFileSync("file2.js", "utf8") }, options).code, "utf8"); fs.writeFileSync("part2.js", UglifyJS.minify({ "file3.js": fs.readFileSync("file3.js", "utf8"), "file4.js": fs.readFileSync("file4.js", "utf8") }, options).code, "utf8"); fs.writeFileSync(cacheFileName, JSON.stringify(options.nameCache), "utf8");

Ein Beispiel für eine Kombination von minify() :

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21
var code = { "file1.js": "function add(first, second) { return first + second; }", "file2.js": "console.log(add(1 + 2, 3 + 4));" }; var options = { toplevel: true, compress: { global_defs: { "@console.log": "alert" }, passes: 2 }, output: { beautify: false, preamble: "/* uglified */" } }; var result = UglifyJS.minify(code, options); console.log(result.code); // /* uglified */ // alert(10);"

So erstellen Sie Warnungen:

1 2 3 4 5 6
var code = "function f(){ var u; return 2 + 3; }"; var options = { warnings: true }; var result = UglifyJS.minify(code, options); console.log(result.error); // runtime error, `undefined` in this case console.log(result.warnings); // [ 'Dropping unused variable u [0:1,18]' ] console.log(result.code); // function f(){return 5}

Ein Fehlerbeispiel:

1 2 3
var result = UglifyJS.minify({"foo.js" : "if (0) else console.log(1);"}); console.log(JSON.stringify(result.error)); // {"message":"Unexpected token: keyword (else)","filename":"foo.js","line":1,"col":7,"pos":7}

Hinweis: Im Gegensatz zu `uglify-js@2.x , the 3.x`-API keine Fehler aus. Um einen ähnlichen Effekt zu erzielen, können Sie Folgendes tun:

1 2
var result = UglifyJS.minify(code, options); if (result.error) throw result.error;

Optionen minimieren

  • warnings (default false ) - result.warnings Sie true , um Kompressorwarnungen in result.warnings . Verwenden Sie den Wert "verbose" für detailliertere Warnungen.

  • parse (Standard {} ) - Übergibt ein Objekt, wenn Sie einige zusätzliche Analyseoptionen angeben möchten.

  • compress (Standard {} ) - Übergeben Sie false , um die Komprimierung vollständig zu überspringen. Übergeben Sie ein Objekt, um benutzerdefinierte Komprimierungsoptionen anzugeben.

  • mangle (Standardwert true ) - Übergeben Sie false , um Mangle-Namen zu überspringen, oder übergeben Sie ein Objekt, um Mangle-Optionen anzugeben (siehe unten).

    • mangle.properties (Standardwert false ) - eine Unterkategorie der Mangle-Option. mangle.properties ein Objekt, um benutzerdefinierte Mangle-Eigenschaftsoptionen anzugeben.
  • output (Standard null ) - Übergeben Sie ein Objekt, wenn Sie zusätzliche Ausgabeoptionen angeben möchten. Die Standardeinstellungen sind für die beste Komprimierung optimiert.

  • sourceMap (Standardwert false ) - Übergeben Sie ein Objekt, wenn Sie Optionen für die sourceMap angeben möchten.

  • toplevel (Standardwert false ) toplevel auf true wenn Sie die toplevel von Variablen und Funktionsnamen auf oberster Ebene aktivieren und nicht verwendete Variablen und Funktionen toplevel möchten.

  • nameCache (Standardwert null ) - nameCache ein leeres Objekt {} oder ein zuvor verwendetes nameCache Objekt, wenn Sie nameCache Variablen- und Eigenschaftsnamen in mehreren Aufrufen von minify() . Hinweis: Dies ist eine Lese- / Schreibeigenschaft. minify() wird Lesen Sie den Status des Namenscaches dieses Objekts und aktualisieren Sie es während der Minimierung, damit es vom Benutzer wiederverwendet oder extern beibehalten werden kann.

  • ie8 (Standardwert false ) - Auf true , um IE8 zu unterstützen.

  • keep_fnames (Standard: false ) -pass true , um das Verwerfen oder Verfälschen von Funktionsnamen zu verhindern. Nützlich für Code, der auf Function.prototype.name keep_fnames .

Optionsstruktur minimieren

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25
{ parse: { // parse options }, compress: { // compress options }, mangle: { // mangle options properties: { // mangle property options } }, output: { // output options }, sourceMap: { // source map options }, nameCache: null, // or specify a name cache object toplevel: false, ie8: false, warnings: false, }

Source map options

So erstellen Sie eine Quellkarte:

1 2 3 4 5 6 7 8
var result = UglifyJS.minify({"file1.js": "var a = function() {};"}, { sourceMap: { filename: "out.js", url: "out.js.map" } }); console.log(result.code); // minified output console.log(result.map); // source map

Beachten Sie, dass die result.map nicht in einer Datei gespeichert wird, sondern nur in result.map . Der für sourceMap.url Wert wird nur verwendet, um //# sourceMappingURL=out.js.map in result.code . Der Wert von filename wird nur zum file Dateiattributs (siehe Spezifikation ) in der Quellzuordnungsdatei verwendet.

Sie können die Option sourceMap.url auf "inline" und die sourceMap.url wird an den Code angehängt.

Sie können auch die sourceRoot-Eigenschaft angeben, die in die Quellzuordnung aufgenommen werden soll:

1 2 3 4 5 6
var result = UglifyJS.minify({"file1.js": "var a = function() {};"}, { sourceMap: { root: "http://example.com/src", url: "out.js.map" } });

Wenn Sie kompiliertes JavaScript komprimieren und eine sourceMap.content dafür haben, können Sie sourceMap.content :

1 2 3 4 5 6 7
var result = UglifyJS.minify({"compiled.js": "compiled code"}, { sourceMap: { content: "content from compiled.js.map", url: "minified.js.map" } }); // same as before, it returns `code` and `map`

Wenn Sie stattdessen den X-SourceMap Header verwenden, können Sie sourceMap.url einfach weglassen.

Analyseoptionen

  • bare_returns (default false ) - Top - Level - Support return Aussagen

  • html5_comments (Standardwert true )

  • shebang (default true ) - Unterstützung #!command AS in der ersten Zeile

Optionen komprimieren

  • arguments (Standard: true ) - Ersetzen Sie arguments[index] Möglichkeit durch den Namen des Funktionsparameters.

  • booleans (Standard: true ) - booleans Optimierungen für den booleschen Kontext, z. B. !!a ? b : c → a ? b : c

  • collapse_vars (Standard: true ) -Collapse nicht konstante Variablen für den einmaligen Gebrauch, sofern die Nebenwirkungen dies zulassen.

  • comparisons (Standard: true ) - Wenden Sie bestimmte Optimierungen auf Binärknoten an, z. B. !(a <= b) → a > b , und versuchen Sie, Binärknoten zu negieren, z. B. a = !b && !c && !d && !e → a=!(b||c||d||e) usw.

  • conditionals (Standard: true ) - Optimierungen für if -s und bedingte Ausdrücke anwenden

  • dead_code (Standard: true ) - dead_code nicht erreichbaren Code

  • drop_console (Standard: false ) -Pass true , um Aufrufe an die console.* zu verwerfen console.* Funktionen. Wenn Sie einen bestimmten Funktionsaufruf wie console.info und / oder Nebenwirkungen von Funktionsargumenten nach dem pure_funcs des Funktionsaufrufs pure_funcs verwenden Sie pure_funcs stattdessen.

  • drop_debugger (Standard: true ) - debugger; drop_debugger debugger; Anweisungen

  • evaluate (Standard: true ) - Versuch, konstante Ausdrücke zu evaluieren

  • expression (Standard: false ) -Pass true , um die Abschlusswerte von Terminalanweisungen ohne return beizubehalten, z. B. in Lesezeichen.

  • global_defs (Standard: {} ) - siehe bedingte Kompilierung

  • hoist_funs (Standard: false ) hoist_funs Funktionsdeklarationen

  • hoist_props (Standard: true ) hoist_props Eigenschaften von konstanten Objekt- und Array-Literalen in reguläre Variablen, die einer Reihe von Einschränkungen unterliegen. Beispiel: var o={p:1, q:2}; f(op, oq); is auf umgesetztes f(1, 2); Note :. hoist_props funktioniert am besten mit mangle aktiviert, wird die compress Option passes SET zu 2 oder IN BEREICHEN COMMUNICAITIONS, und die compress Option toplevel aktiviert.

  • hoist_vars (Standard: false ) hoist_vars var Deklarationen (dies ist standardmäßig false da es die Größe der Ausgabe im Allgemeinen zu erhöhen scheint)

  • if_return (Standard: true ) if_return für if / return und if / continue

  • inline (Standard: true ) -Inline-Aufrufe, um mit der einfachen / return Anweisung zu funktionieren:

    • false -same as 0
    • 0 deaktiviertes Inlining
    • 1 -line einfache Funktionen
    • 2 Inline-Funktionen mit Argumenten
    • 3 Inline-Funktionen mit Argumenten und Variablen
    • true - wie 3
  • join_vars (Standard: true ) - join_vars aufeinanderfolgende var Anweisungen

  • keep_fargs (Standard: true ) - Verhindert, dass der Kompressor nicht verwendete Funktionsargumente verwirft. Sie benötigen dies für Code, der auf Function.length basiert.

  • keep_fnames (Standard: false ) keep_fnames true , um zu verhindern, dass der Kompressor Funktionsnamen verwirft. Nützlich für Code, der auf Function.prototype.name keep_fnames . Siehe auch: die Option keep_fnames mangle .

  • keep_infinity (Standard: false ) keep_infinity true , um zu verhindern, dass Infinity auf 1/0 komprimiert wird, was zu Leistungsproblemen in Chrome führen kann.

  • loops (Standard: true ) - Optimierungen für do , while und for Schleifen, wenn wir die Bedingung statisch bestimmen können.

  • negate_iife (Standard: true ) negate_iife "Sofort aufgerufene Funktionsausdrücke", bei denen der Rückgabewert verworfen wird, um die Parens zu vermeiden, die der Codegenerator einfügen würde.

  • passes (Standard: 1 ) - Die maximale Häufigkeit, mit der die Komprimierung ausgeführt wird. In einigen Fällen führt mehr als ein Durchgang zu weiter komprimiertem Code. Beachten Sie, dass mehr Durchgänge mehr Zeit in Anspruch nehmen.

  • properties (Standard: true ) - Schreiben Sie den Eigenschaftszugriff mithilfe der Punktnotation, z. B. foo["bar"] → foo.bar

  • pure_funcs (Standard: null ) - pure_funcs können ein Array von Namen übergeben, und UglifyJS geht davon aus, dass diese Funktionen keine Nebenwirkungen hervorrufen. GEFAHR: Überprüft nicht, ob der Name im Gültigkeitsbereich neu definiert wurde. Ein Beispiel hier, z. B. var q = Math.floor(a/b) . Wenn die Variable q nicht anderweitig verwendet wird, wird sie von Math.floor(a/b) , der Math.floor(a/b) bleibt jedoch erhalten, ohne zu wissen, was er tut. Sie können pure_funcs: [ 'Math.floor' ] , um pure_funcs: [ 'Math.floor' ] , dass diese Funktion keine Nebenwirkungen hervorruft. In diesem Fall wird die gesamte Anweisung verworfen. Die aktuelle Implementierung pure_funcs Overhead (die Komprimierung ist langsamer). pure_funcs Sie sicher, dass auch Symbole unter pure_funcs sind unter mangle.reserved , um ein mangle.reserved zu vermeiden.

  • pure_getters (Standard: "strict" ) - Wenn Sie dies als true , geht UglifyJS davon aus, dass der Zugriff auf foo.bar (z. B. foo.bar oder foo["bar"] ) keine Nebenwirkungen hat. Geben Sie "strict" an foo.bar nur dann als foo.bar wenn foo sicher nicht wirft, dh nicht null oder undefined .

  • reduce_funcs (Standard: true ) - reduce_funcs das Einfügen von Einwegfunktionen als Funktionsausdrücke, wenn dies zulässig ist. reduce_vars ermöglicht eine weitere Optimierung. Standardmäßig aktiviert. Die Option hängt davon ab, reduce_vars aktiviert ist. Einige Codes werden in der Chrome V8-Engine schneller ausgeführt, wenn diese Option deaktiviert ist Wirkt sich nicht negativ auf andere gängige Browser aus.

  • reduce_vars (Standard: true ) - reduce_vars Optimierung für Variablen, denen konstante Werte zugewiesen und als reduce_vars verwendet werden.

  • sequences (Standard: true ) - .. die Verwendung der Join aufeinander folgenden Aussagen The Simple On Komma - Operator A Mai SET zu der BE Geben Sie die maximale positive Integer Anzahl von aufeinanderfolgenden Komma Sequenzen generiert , dass die Wenn die mit dieser Option eingestellt ist BE true die dann die sequences Limit ist 200 Setzen Sie die Option auf false oder 0 , um sie zu deaktivieren. Die kleinste sequences ist 2 Ein sequences von 1 ist groß, um true zu entsprechen, und bedeutet daher 200 In seltenen Fällen führt die Standardsequenzbegrenzung zu sehr langsamen Komprimierungszeiten In diesem Fall wird ein Wert von 20 oder weniger empfohlen.

  • side_effects (Standard: true ) side_effects false , um potenziell als "pure" gekennzeichnete Funktionen zu deaktivieren. Ein Funktionsaufruf wird als "pure" markiert, wenn eine Kommentaranmerkung /*@__PURE__*/ oder /*#__PURE__*/ unmittelbar vor dem steht call. Zum Beispiel: /*@__PURE__*/foo();

  • switches (Standard: true ) - und die Remove Duplicate de-unerreichbare switch Zweige

  • toplevel (Standard: false ) -drop nicht referenzierte Funktionen ( "funcs" ) und / oder Variablen ( "vars" ) im Bereich der obersten Ebene (standardmäßig false , true , um nicht referenzierte Funktionen und Variablen zu löschen)

  • top_retain (Standard: null ) - top_retain bestimmte Funktionen und Variablen auf top_retain Ebene unused verwendet werden (kann Array, durch Kommas getrennt, RegExp oder Funktion sein. toplevel ).

  • typeofs (Standard: true ) typeofs typeof foo == "undefined" in foo === void 0 Hinweis: Es wird empfohlen, diesen Wert aufgrund bekannter Probleme für IE10 und frühere Versionen auf false zu setzen.

  • unsafe (Standard: false ) - "unsichere" Transformationen anwenden (Diskussion unten)

  • unsafe_comps (Standard: false ) unsafe_comps Ausdrücke wie a <= b vorausgesetzt, keiner der Operanden kann zu NaN (gezwungen) werden.

  • unsafe_Function (Standard: false ) unsafe_Function and mangle Function(args, code) wenn sowohl args als auch code Zeichenfolgenliterale sind.

  • unsafe_math (Standard: false ) - unsafe_math numerische Ausdrücke wie 2 * x * 3 in 6 * x , was zu ungenauen Gleitkommaergebnissen führen kann.

  • unsafe_proto (Standard: false ) - unsafe_proto Ausdrücke wie Array.prototype.slice.call(a) in [].slice.call(a)

  • unsafe_regexp (Standard: false ) - unsafe_regexp Ersetzen von Variablen mit RegExp Werten auf die gleiche Weise, als wären sie Konstanten.

  • unsafe_undefined (Standard: false ) -substitute void 0 wenn eine Variable mit dem Namen undefined im Gültigkeitsbereich vorhanden ist (Variablenname wird entstellt, normalerweise auf ein einzelnes Zeichen reduziert)

  • unused (Standard: true ) -Tropfen nicht referenzierte Funktionen und Variablen (einfache direkte Variablenzuweisungen zählen nicht als Referenzen, es sei denn, sie sind auf "keep_assign" )

  • warnings (Standard: false ) - Zeigt Warnungen an, wenn nicht erreichbarer Code oder nicht verwendete Deklarationen usw. gelöscht werden.

Mangle Optionen

  • eval (Standardwert false ) -Pass true für Mangelnamen, die in Bereichen sichtbar sind, in denen eval oder with verwendet werden.

  • keep_fnames (Standardwert false ) keep_fnames true um Funktionsnamen nicht zu keep_fnames . Nützlich für Code, der auf Function.prototype.name keep_fnames . Siehe auch: die Option keep_fnames compress .

  • reserved (Standard [] ) - Übergeben Sie ein Array von Bezeichnern, die vom Mangeln ausgeschlossen werden sollen. Beispiel: ["foo", "bar"] .

  • toplevel (Standardwert false ) -Pass true für Mangle-Namen, die im Bereich der obersten Ebene deklariert wurden.

Beispiele:

1 2 3 4 5
// test.js var globalVar; function funcName(firstLongName, anotherLongName) { var myVariable = firstLongName + anotherLongName; }
1 2 3 4 5 6 7 8 9 10
var code = fs.readFileSync("test.js", "utf8"); UglifyJS.minify(code).code; // 'function funcName(a,n){}var globalVar;' UglifyJS.minify(code, { mangle: { reserved: ['firstLongName'] } }).code; // 'function funcName(firstLongName,a){}var globalVar;' UglifyJS.minify(code, { mangle: { toplevel: true } }).code; // 'function n(n,a){}var a;'

Mangle properties options

  • builtins (Standard: false ) - Verwenden Sie true , um das Mangeln der integrierten DOM-Eigenschaften zu ermöglichen. Es wird nicht empfohlen, diese Einstellung zu überschreiben.

  • debug (Standard: false ) - Mangelnamen, bei denen der ursprüngliche Name noch vorhanden ist. Übergeben Sie eine leere Zeichenfolge "" , um sie zu aktivieren, oder eine nicht leere Zeichenfolge, um das Debug-Suffix festzulegen.

  • keep_quoted (Standard: false ) - Nur nicht keep_quoted Eigenschaftsnamen keep_quoted .

  • regex (Standard: null ) - Übergeben Sie ein RegExp-Literal nur an Mangle-Eigenschaftsnamen, die dem regulären Ausdruck entsprechen.

  • reserved (Standard: [] ) - Verfälschen Sie die im reserved Array aufgelisteten Eigenschaftsnamen nicht.

Ausgabeoptionen

Der Codegenerator versucht, standardmäßig den kürzest möglichen Code auszugeben. --beautify Sie eine verschönerte Ausgabe wünschen, übergeben Sie --beautify ( -b ). Optional können Sie zusätzliche Argumente übergeben, die die Code-Ausgabe steuern:

  • ascii_only (Standardwert false ) ascii_only Unicode-Zeichen in Zeichenfolgen und regulären Ausdrücken (wirkt sich auf Anweisungen aus, bei denen Nicht-ASCII-Zeichen ungültig werden).

  • beautify (Standardwert true ) - ob die Ausgabe tatsächlich verschönert werden soll. Wenn Sie -b wird dies auf true gesetzt. Möglicherweise müssen Sie jedoch -b auch wenn Sie minimierten Code generieren möchten, um zusätzliche Argumente anzugeben Verwenden Sie -b beautify=false , um es zu überschreiben.

  • braces (Standardwert false ) - Fügen Sie immer Klammern in if , for , do , while oder with Anweisungen ein, auch wenn ihr Text eine einzelne Anweisung ist.

  • comments (Standardwert false ) - Übergeben Sie true oder "all" , um alle Kommentare beizubehalten, "some" , um einige Kommentare beizubehalten, eine Zeichenfolge für reguläre Ausdrücke (z. B. /^!/ ) oder eine Funktion.

  • indent_level (Standard 4 )

  • indent_start (Standard 0 ) - Präfixieren Sie alle Zeilen um so viele Leerzeichen

  • inline_script (default true ) inline_script HTML-Kommentare und der Schrägstrich in </script> in Zeichenfolgen

  • keep_quoted_props (Standardwert false ) - keep_quoted_props , wird verhindert, dass Anführungszeichen aus Eigenschaftsnamen in Objektliteralen entfernt werden.

  • max_line_len (Standardwert false ) - max_line_len Zeilenlänge (für hässlichen Code)

  • preamble (Standardwert null ) - Wenn sie übergeben wird, muss es sich um eine Zeichenfolge handeln, die der Ausgabe buchstäblich vorangestellt wird. Die Quellzuordnung wird an diesen Text angepasst. Kann zum Einfügen eines Kommentars verwendet werden, der beispielsweise Lizenzinformationen enthält.

  • preserve_line (Standardwert false ) -pass true , um Zeilen beizubehalten, funktioniert jedoch nur, wenn beautify auf false .

  • quote_keys (Standardwert false ) quote_keys true , um alle Schlüssel in quote_keys in Anführungszeichen zu setzen

  • quote_style (Standard 0 ) - bevorzugter Anführungszeichenstil für Zeichenfolgen (wirkt sich auch auf zitierte Eigenschaftsnamen und Direktiven aus):

    • 0 bevorzugt doppelte Anführungszeichen, wechselt zu einfachen Anführungszeichen, wenn die Zeichenfolge selbst mehr doppelte Anführungszeichen enthält. 0 ist am besten für die Größe von gzip geeignet.
    • 1 - Verwenden Sie immer einfache Anführungszeichen
    • 2 - Verwenden Sie immer doppelte Anführungszeichen
    • 3 Verwenden Sie immer die ursprünglichen Anführungszeichen
  • semicolons (Standardwert true ) - getrennte Anweisungen mit Semikolons. Wenn Sie false , verwenden wir nach Möglichkeit eine neue Zeile anstelle eines Semikolons, was zu einer besser lesbaren Ausgabe von hässlichem Code führt (Größe vor gzip könnte kleiner sein, Größe nach gzip unbedeutend größer ).

  • shebang (default true ) - behalte shebang #! in der Präambel (Bash-Skripte)

  • webkit (Standardwert false ) - Problemumgehungen für WebKit-Fehler aktivieren. PhantomJS-Benutzer sollten diese Option auf true .

  • width (Standard 80 ) - wird nur wirksam, wenn die Verschönerung aktiviert ist. Dies gibt eine (orientative) Linienbreite an, die der Verschönerer zu beachten versucht. Sie bezieht sich auf die Breite des Linientextes (ohne Einrückung). Sie funktioniert nicht Derzeit sehr gut, aber der von UglifyJS generierte Code wird dadurch besser lesbar.

  • wrap_iife (Standardwert false ) wrap_iife true , um sofort aufgerufene Funktionsausdrücke zu verpacken. Weitere Informationen finden Sie unter # 640 .

Verschiedenes

CAN - Pass von Ihnen --comments Der behalten Bestimmte auf Kommentare der Ausgang standardmäßig in IT-Stil wird JSDoc Sie , dass Kommentare "@preserve", "@license" oder "@cc_on" (Conditional Compilation für IEs) Pass von You CAN enthalten.. --comments all to keep all the comments, or a valid JavaScript regexp to keep only comments that match this regexp. For example --comments /^!/ will keep comments like /*! Copyright Notice */ .

Note, however, that there might be situations where comments are lost. For example:

1 2 3 4 5 6 7
function f() { /** @preserve Foo Bar */ function g() { // this function is never called } return something(); }

Even though it has "@preserve", the comment will be lost because the inner function g (which is the AST node to which the comment is attached to) is discarded by the compressor as not referenced.

The safest comments where to place copyright information (or other info that needs to be kept in the output) are comments attached to toplevel nodes.

The unsafe compress option

It enables some transformations that might break code logic in certain contrived cases, but should be fine for most code. You might want to try it on your own code, it should reduce the minified size. Here's what happens when this flag is on:

  • new Array(1, 2, 3) or Array(1, 2, 3)[ 1, 2, 3 ]
  • new Object(){}
  • String(exp) or exp.toString()"" + exp
  • new Object/RegExp/Function/Error/Array (...) → we discard the new

Conditional compilation

You can use the --define ( -d ) switch in order to declare global variables that UglifyJS will assume to be constants (unless defined in scope). For example if you pass --define DEBUG=false then, coupled with dead code removal UglifyJS will discard the following from the output:

1 2 3
if (DEBUG) { console.log("debug stuff"); }

You can specify nested constants in the form of --define env.DEBUG=false .

UglifyJS will warn about the condition being always false and about dropping unreachable code; for now there is no option to turn off only this specific warning, you can pass warnings=false to turn off all warnings.

Another way of doing that is to declare your globals as constants in a separate file and include it into the build. For example you can have a build/defines.js file with the following:

1 2 3
var DEBUG = false; var PRODUCTION = true; // etc.

and build your code like this:

1
uglifyjs build/defines.js js/foo.js js/bar.js... -c

UglifyJS will notice the constants and, since they cannot be altered, it will evaluate references to them to the value itself and drop unreachable code as usual. The build will contain the const declarations if you use them. If you are targeting < ES6 environments which does not support const , using var with reduce_vars (enabled by default) should suffice.

Conditional compilation API

You can also use conditional compilation via the programmatic API. With the difference that the property name is global_defs and is a compressor property:

1 2 3 4 5 6 7 8
var result = UglifyJS.minify(fs.readFileSync("input.js", "utf8"), { compress: { dead_code: true, global_defs: { DEBUG: false } } });

To replace an identifier with an arbitrary non-constant expression it is necessary to prefix the global_defs key with "@" to instruct UglifyJS to parse the value as an expression:

1 2 3 4 5 6 7 8
UglifyJS.minify("alert('hello');", { compress: { global_defs: { "@alert": "console.log" } } }).code; // returns: 'console.log("hello");'

Otherwise it would be replaced as string literal:

1 2 3 4 5 6 7 8
UglifyJS.minify("alert('hello');", { compress: { global_defs: { "alert": "console.log" } } }).code; // returns: '"console.log"("hello");'

Using native Uglify AST with minify()

1 2 3 4 5 6 7 8 9 10 11 12 13
// example: parse only, produce native Uglify AST var result = UglifyJS.minify(code, { parse: {}, compress: false, mangle: false, output: { ast: true, code: false // optional - faster if false } }); // result.ast contains native Uglify AST
1 2 3 4 5 6 7 8 9 10 11 12 13 14
// example: accept native Uglify AST input and then compress and mangle // to produce both code and native AST. var result = UglifyJS.minify(ast, { compress: {}, mangle: {}, output: { ast: true, code: true // optional - faster if false } }); // result.ast contains native Uglify AST // result.code contains the minified code in string form.

Working with Uglify AST

Transversal and transformation of the native AST can be performed through TreeWalker and TreeTransformer respectively.

ESTree / SpiderMonkey AST

UglifyJS has its own abstract syntax tree format; for practical reasons we can't easily change to using the SpiderMonkey AST internally. However, UglifyJS now has a converter which can import a SpiderMonkey AST.

For example Acorn is a super-fast parser that produces a SpiderMonkey AST. It has a small CLI utility that parses one file and dumps the AST in JSON on the standard output. To use UglifyJS to mangle and compress that:

1
acorn file.js | uglifyjs -p spidermonkey -m -c

The -p spidermonkey option tells UglifyJS that all input files are not JavaScript, but JS code described in SpiderMonkey AST in JSON. Therefore we don't use our own parser in this case, but just transform that AST into our internal AST.

Use Acorn for parsing

More for fun, I added the -p acorn option which will use Acorn to do all the parsing. If you pass this option, UglifyJS will require("acorn") .

Acorn is really fast (eg 250ms instead of 380ms on some 650K code), but converting the SpiderMonkey tree that Acorn produces takes another 150ms so in total it's a bit more than just using UglifyJS's own parser.

Uglify Fast Minify Mode

It's not well known, but whitespace removal and symbol mangling accounts for 95% of the size reduction in minified code for most JavaScript - not elaborate code transforms. One can simply disable compress to speed up Uglify builds by 3 to 4 times. In this fast mangle -only mode Uglify has comparable minify speeds and gzip sizes to butternut :

d3.js minify size gzip size minify time (seconds)
original 451,131 108,733 -
uglify-js@3.0.24 mangle=false, compress=false 316,600 85,245 0.70
uglify-js@3.0.24 mangle=true, compress=false 220,216 72,730 1.13
butternut@0.4.6 217,568 72,738 1.41
uglify-js@3.0.24 mangle=true, compress=true 212,511 71,560 3.36
babili@0.1.4 210,713 72,140 12.64

To enable fast minify mode from the CLI use:

1
uglifyjs file.js -m

To enable fast minify mode with the API use:

1
UglifyJS.minify(code, { compress: false, mangle: true });

Source maps and debugging

Various compress transforms that simplify, rearrange, inline and remove code are known to have an adverse effect on debugging with source maps. This is expected as code is optimized and mappings are often simply not possible as some code no longer exists. For highest fidelity in source map debugging disable the Uglify compress option and just use mangle .

Compiler assumptions

To allow for better optimizations, the compiler makes various assumptions:

  • .toString() and .valueOf() don't have side effects, and for built-in objects they have not been overridden.
  • undefined , NaN and Infinity have not been externally redefined.
  • arguments.callee , arguments.caller and Function.prototype.caller are not used.
  • The code doesn't expect the contents of Function.prototype.toString() or Error.prototype.stack to be anything in particular.
  • Getting and setting properties on a plain object does not cause other side effects (using .watch() or Proxy ).
  • Object properties can be added , removed and modified (not prevented with Object.defineProperty() , Object.defineProperties() , Object.freeze() , Object.preventExtensions() or Object.seal() ).