Turn: use node to compress and merge JS, CSS, and images

Source: Internet
Author: User

1. Install nodejs

Http://nodejs.org/

2. Install the respective node package

Js I use uglifyjs GitHub address: https://github.com/mishoo/UglifyJS

Css I use clean-CSS GitHub address: https://github.com/GoalSmashers/clean-css

The image uses node-smushit GitHub address: https://github.com/colorhook/node-smushit

3. WriteCode

// Jsvar FS = require ('fs'); var JSP = require ("uglify-js "). parser; var pro = require ("uglify-js "). uglify; function jsminifier (fliein, fileout) {var fliein = array. isarray (fliein )? Fliein: [fliein]; var origcode, AST, finalcode = ''; For (VAR I = 0; I <fliein. length; I ++) {origcode = FS. readfilesync (fliein [I], 'utf8'); AST = jsp. parse (origcode); AST = pro. ast_mangle (AST); AST = pro. ast_squeeze (AST); finalcode + = ';' + pro. gen_code (AST);} FS. writefilesync (fileout, finalcode, 'utf8');} // jsminifier ('. /file-src/test2.js ','. /file-Smin/test-min.js '); // a single file compressed jsminifier (['. /file-src/test. js ','. /file-src/test2.js '],'. /file-Smin/test-min.js '); // merge compression Command Translation

Use uglifyjs

Uglifyjs [Option...] [File]

File parameters should be placed behind the options. uglifyjs will read the JavaScript code in the file for processing. If you do not specify the output file name, the processed content is output to the command line.

Supported options:

●-B or-beautify-output formatting code. When this parameter is passed in, the following additional options are used to better control formatting:

●-I n or-indent N-indent level (number of spaces)

●-Q or-quote-keys-whether to use quotation marks to cause the key of the string object (by default, only the key names that cannot be correctly marked will be caused)

●-Ascii-by default, uglifyjs does not process character encoding but directly outputs Unicode characters. this parameter is used to convert non-ASCII characters into the \ cxxxx sequence (the output is always UTF-8 encoded, but input this option to get the output of the ASCII code ).

●-Nm or-no-mangle-do not change the variable name

●-Ns or-no-squeeze-do not call the ast_squeeze () function (this function will be optimized to make the result smaller and slightly less readable)

●-Mt or-mangle-toplevel-disrupt variable names in top-level scopes (disabled by default)

●-No-seqs-when you call ast_squeeze (), multiple statement blocks are merged into one statement block, for example, "A = 10; B = 20; Foo () "will be converted to" A = 10, B = 20, Foo ()"

●-No-dead-code-the default uglifyjs will delete unused code and pass in this parameter to disable this function.

●-NC or-no-copyright-by default, uglifyjs adds copyright information and other comments to the output code, and passes in this parameter to disable this function.

●-O file name or-output file name-specifies the output file name. If not specified, it is printed to the standard output (stdout)

●-Overwrite-if the input JS Code comes from a file rather than a standard input, this parameter is input and the output will overwrite the file.

●-Ast-passing in this parameter will produce an abstract syntax tree instead of JavaScript, which is useful for debugging or understanding internal code.

●-V or-verbose-output some information in the standard error (the current version only outputs the operation time)

●-Extra-enable additional optimization, which has not been fully tested.

●-Unsafe-enable other additional optimizations. These optimizations are known to be insecure under specific circumstances and currently only support:

● Foo. tostring () => Foo + ""

●-Max-line-len (32 K byte by default)-adds a line break to 32 K byte, and passes in 0 to disable this function.

●-Reserved-names-some class libraries depend on some variables, and the names specified by this parameter are not obfuscated. Multiple libraries are separated by commas.

 
// Cssvar cleancss = require ('clean-CSS '); function cssminifier (fliein, fileout) {var fliein = array. isarray (fliein )? Fliein: [fliein]; var origcode, finalcode = ''; For (VAR I = 0; I <fliein. length; I ++) {origcode = FS. readfilesync (fliein [I], 'utf8'); finalcode + = cleancss. process (origcode);} FS. writefilesync (fileout, finalcode, 'utf8');} // cssminifier ('. /file-src/indexw_20120913.css ','. /file-Smin/index.css '); // cssminifier (['. /file-src/index_20120913.css ','. /file-src/indexw_20120913.css '],'. /file-Smin/index.css '); // image var imgminifier = require ('node-smushit'); // imgminifier. smushit ('. /file-src/images ', {recursive: true}); // recursive imgminifier. smushit ('. /file-src/images ');

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.