如何壓縮js代碼

Ⅰ 如何使用nodejs 的 uglifyjs 壓縮js文件

[js壓縮]uglifyjs source.js -mc -o target.min.js
以壓縮angular.js為例，可以壓縮局部變數名，去掉無用的局部變數，空白符等，壓縮比例接近80%，效率不錯
[user_00@localhost ~]$ uglifyjs angular.js -mc -o angular.min.js
WARN: Dropping unused function isBoolean [angular.js:416,9]
WARN: Dropping unused function makeMap [angular.js:446,9]
WARN: Dropping unused function size [angular.js:488,9]
WARN: Dropping unused function isLeafNode [angular.js:523,9]
WARN: Dropping unused function argument boundTranscludeFn [angular.js:4682,27]
WARN: Dropping unused function argument rootElement [angular.js:4681,16]
WARN: Dropping unused function argument nodeList [angular.js:4680,17]
WARN: Dropping unused function argument scope [angular.js:4679,22]
WARN: Dropping unused function nodesetLinkingFn [angular.js:4678,9]
WARN: Dropping unused function argument boundTranscludeFn [angular.js:4690,27]
WARN: Dropping unused function argument rootElement [angular.js:4689,16]
WARN: Dropping unused function argument node [angular.js:4688,13]
WARN: Dropping unused function argument scope [angular.js:4687,22]
WARN: Dropping unused function argument nodesetLinkingFn [angular.js:4686,25]
WARN: Dropping unused function directiveLinkingFn [angular.js:4685,9]
WARN: Dropping unused function stripHash [angular.js:5009,9]
WARN: Dropping unused variable NG_SWITCH [angular.js:13857,4]
WARN: Dropping unused variable fns [angular.js:1536,8]
WARN: Dropping unused variable events [angular.js:1536,13]
WARN: Dropping unused function wrongMode [angular.js:3879,13]
WARN: Dropping unused function argument cause [angular.js:4799,31]
WARN: Dropping unused function argument exception [angular.js:4799,20]
WARN: Dropping unused function argument args [angular.js:8165,28]
WARN: Dropping unused function argument args [angular.js:8231,33]
WARN: Dropping unused function argument names [angular.js:9018,32]
WARN: Dropping unused function argument name [angular.js:9030,40]
WARN: Dropping unused variable value [angular.js:9230,14]
WARN: Dropping unused function argument value [angular.js:12475,36]
[user_00@localhost ~]$ ls -lh angular.*
-rw-rw-r-- 1 user_00 user_00 479K Apr 5 01:53 angular.js
-rw-rw-r-- 1 user_00 user_00 79K May 4 16:09 angular.min.js

Ⅱ [娌圭尨鑴氭湰寮鍙戞寚鍗梋JSZIP搴撳帇緙╄В鍘嬫枃浠

鎺㈢儲鍓嶇鍘嬬緝涓庤В鍘嬬殑欖旀硶媯: JSZIP

鍦ㄥ墠絝寮鍙戜腑錛孞SZip鏃犵枒鏄涓鎶婂己澶х殑鐟炲＋鍐涘垁錛屽畠璁╂垜浠鑳藉熻交鏉懼疄鐜版枃浠剁殑鍘嬬緝涓庤В鍘嬨傛帴涓嬫潵錛岃╂垜浠涓璧鋒繁鍏ヤ簡瑙ｅ備綍鍦ㄩ」鐩涓浼橀泤鍦拌繍鐢ㄨ繖涓搴撱

棣栧厛錛屽壋寤轟竴涓狫SZip瀹炰緥灝卞儚鎵撳紑涓鎵囬氬線鏂囦歡鎿嶄綔鐨勬柊紿楀彛:

閫氳繃瀹冪殑 file 鍜 folder 鏂規硶錛屾垜浠鍙浠ユ坊鍔犳枃浠朵笌鐩褰:

• 娣誨姞鏂囨湰鏂囦歡:
  
  zip.file("hello.txt", "Hello World "); 鎴栬咃紝鏀鎸佹崲琛岀︾殑:
  
  zip.file("hello.txt", "Hello my friend ");


• 鍒涘緩鏂囦歡澶:
  
  zip.folder("nested").file("hello.txt", "Hello Again "); 榪欓噷錛屾枃浠跺皢瀛樻斁鍦ㄥ祵濂楃殑 "nested" 鏂囦歡澶逛笅銆

姣忔¤皟鐢ㄨ繖浜涙柟娉曞悗錛岃繑鍥炵殑閮芥槸zip瀹炰緥鏈韜錛屼究浜庢垜浠閾懼紡璋冪敤錛屾搷浣滄洿涓虹洿瑙:

鏂囦歡鍐呭圭殑璇誨彇鍚屾牱綆鍗曪紝鏃犺烘槸瀛楃︿覆榪樻槸浜岃繘鍒舵暟緇:

• zip.file("hello.txt").async("string").then(data => { /* "Hello World " */ });


• 瀵逛簬鏀鎸佺殑鐜澧冿紝鍙浠ヤ嬌鐢 Uint8Array:
  
  zip.file("hello.txt").async("uint8array").then(data => { /* 浜岃繘鍒舵暟鎹琛ㄧず */ });

鐢熸垚zip鏂囦歡鏃訛紝鎴戜滑鍙浠ラ夋嫨杈撳嚭涓哄瓧絎︿覆鎴栦簩榪涘埗鏁扮粍:

鍔犺澆zip鏂囦歡鏃訛紝紜淇濅嬌鐢ㄤ簩榪涘埗鏁版嵁:

• JSZip 涓嶆敮鎸佸姞瀵嗙殑zip鏂囦歡鎴栧氬嵎zip銆


• 鉶界劧鍙浠ュ姞杞絲ip64鏂囦歡錛屼絾澶勭悊杈冨ぇ鐨勬枃浠跺彲鑳戒細鏈夐檺鍒躲


• 緙栫爜闄愬埗錛欽SZip鍙鏀鎸乁TF-8錛屽勭悊闈濽TF-8緙栫爜鐨勬枃浠墮渶棰濆栧勭悊銆


• 杈撳叆鍜岃緭鍑簔ip鏂囦歡鏃訛紝鍙鑳戒細鍥犱負鍐呴儴澶勭悊鏂瑰紡涓嶅悓錛屽艱嚧鐢熸垚鐨勬枃浠剁暐鏈夊樊寮傘

鎬葷殑鏉ヨ達紝JSZip鏄涓涓寮哄ぇ涓旂伒媧葷殑宸ュ叿錛屼絾鍔″繀娉ㄦ剰鍏跺矓闄愭т互紜淇濆湪欏圭洰涓鎮板綋鍦頒嬌鐢ㄣ傜幇鍦錛屼綘宸茬粡鎺屾彙浜嗗熀鏈鐨勪嬌鐢ㄦ柟娉曪紝鏄鏃跺欏湪浣犵殑欏圭洰涓澶ф樉韜鎵嬩簡錛

Ⅲ webpack怎麼壓縮js

准確來說，在package.json中有一個scripts的一個配置，這個配置中中一個build：webpack -p 需要在cmd中輸入yarn run build命令，就可以進行打包壓縮編譯

Ⅳ 百度js和css合並壓縮是如何做的

簡單來說是通過插件實現，當然現在淘寶出的伺服器（nginx修改版）自帶有這個功能。 通過一個url地址里寫上每個js或者css 路徑，然後插件通過路徑將js/css 進行gzip形式壓縮，最後組合成一個文件輸出。你能看到的輸出格式是php後綴，但是輸出文件的表頭是js/CSS 這樣瀏覽器也就當是js/css來解析了。
合並代碼工具我推薦minify （PHP），這個比較早，也很簡單。
壓縮的話網上有很多地方都提供在線壓縮
簡單說說 JS壓縮：
1. 長變數變數名 壓縮為短變數名，去空格，去注釋
2. 可以將 new Array() 改寫為 []， new Object 改寫為{} 雲雲
3. 使用eval， 關鍵詞等等 的復雜邏輯 也可以壓縮
這樣處理過後，如果覺得還是太大了，還可以採用服務端的gzip壓縮傳輸

Ⅳ 使用vue-cli生成的vendor.js文件太大，有辦法減少體積嗎

使用「js壓縮」工具可縮小體積，可網路搜索「js壓縮」查找工具

把vendor.js代碼ctrl + a全選，再ctrl + c復制，粘貼到js壓縮工具里，點擊「壓縮」或「普通壓縮」，然後再把壓縮後的代碼復制粘貼到vendor.js文件中。