minify for VS Code
Minify your js, css and html files to save transmit bandwidth. Calls each of the minifiers directly, allowing settings to be passed:
- JS: uglify-js v2.7.4
- CSS: clean-css v3.4.21
- HTML: html-minifier v3.2.2
Run the file minifier with F1 Minify
.
Folders containing Javascript and CSS file can be minified to a single file (to {dirname}.min.[css|js]
) with F1 Minify Directory
. It is acceptable to have a single directory minified for both Javascript and CSS.
Optionally runs minify on save when a matching minified file (and/or directory) already exists. Enalbe in your user or workspace settings. The setting defaults are shown below:
"minify.minifyExistingOnSave": false,
"minify.js": {
"mangle": true,
"compress": {
"sequences": true,
"properties": true,
"dead_code": true,
"drop_debugger": true,
"unsafe": false,
"unsafe_comps": false,
"conditionals": true,
"comparisons": true,
"evaluate": true,
"booleans": true,
"loops": true,
"unused": true,
"hoist_funs": true,
"keep_fargs": true,
"keep_fnames": false,
"hoist_vars": false,
"if_return": true,
"join_vars": true,
"collapse_vars": false,
"reduce_vars": false,
"side_effects": true,
"pure_getters": false,
"pure_funcs": null,
"negate_iife": false,
"drop_console": false,
"passes": 1,
"global_defs": {}
},
"output": {
"ascii_only": false,
"inline_script": false,
"max_line_len": 32000,
"braces": false,
"semicolons": true,
"comments": false,
"shebang": true,
"preamble": null,
"quote_style": "best"
}
},
"minify.css": {
"advanced": true,
"aggressiveMerging": true,
"compatibility": "*",
"inliner": {},
"keepBreaks": false,
"keepSpecialComments": "*",
"mediaMerging": true,
"processImport": true,
"processImportFrom": ["all"],
"rebase": true,
"restructuring": true,
"root": "${workspaceRoot}",
"roundingPrecision": 2,
"semanticMerging": false,
"shorthandCompacting": true
},
"minify.html": {
"caseSensitive": false,
"collapseBooleanAttributes": true,
"collapseWhitespace": true,
"conservativeCollapse": false,
"customAttrAssign": [],
"customAttrCollapse": "",
"customAttrSurround": [],
"customEventAttributes": [ "^on[a-z]{3,}$" ],
"decodeEntities": false,
"html5": true,
"ignoreCustomComments": [ "^!" ],
"ignoreCustomFragments": ["<%[\\s\\S]*?%>", "<\\?[\\s\\S]*?\\?>"],
"includeAutoGeneratedTags": true,
"keepClosingSlash": false,
"maxLineLength": false,
"minifyCSS": true, //uses minify.css settings if true
"minifyJS": true, //uses minify.js settings if true
"minifyURLs": false,
"preserveLineBreaks": false,
"preventAttributesEscaping": false,
"processConditionalComments": false,
"processScripts": [],
"quoteCharacter": "\"",
"removeAttributeQuotes": false,
"removeComments": false,
"removeEmptyAttributes": false,
"removeEmptyElements": false,
"removeOptionalTags": false,
"removeRedundantAttributes": false,
"removeScriptTypeAttributes": false,
"removeStyleLinkTypeAttributes": false,
"sortAttributes": false,
"sortClassName": false,
"useShortDoctype": false
}
minifiy.css.root
accepts "${workspaceRoot}
/some/path" to define the internal @import
absolute root.
Since html-minifier
also uses clean-css
and uglify-js
, setting minifyJS
or minifyCSS
to true
will embed the settings you have supplied for those minifiers automatically. You can provide your own settings as an object if you want some different methods to be used.
Like beautify for VS Code, minify accepts an array for file extension that you will accept minification of under minify.JSfiles
, minify.CSSfiles
, and minify.HTMLfiles
.