快捷導(dǎo)航

本地JS文件批量壓縮的操作方法

更新時(shí)間：2022年12月02日 11:39:28 作者：請(qǐng)叫我頭頭哥

這篇文章主要介紹了本地JS文件批量壓縮的方法，由于之前壓縮的JS文件都比較少，都是手動(dòng)壓縮的。這次需要壓縮的文件比較多，所以用了批量壓縮，特此記錄一下，方便大家和自己以后再用到的時(shí)候備忘

最近在維護(hù)一個(gè)小后臺(tái)項(xiàng)目，有段JS需要壓縮上傳到CDN存儲(chǔ)服務(wù)器。由于之前壓縮的JS文件都比較少，都是手動(dòng)壓縮的。這次需要壓縮的文件比較多，所以用了批量壓縮。特此記錄一下，方便大家和自己以后再用到的時(shí)候備忘。

準(zhǔn)備工作

安裝nodejs

首先在本地安裝node.js和npm，一般npm集成于nodejs，即安裝nodejs，同時(shí)也安裝了npm。node.js下載地址，下載以后直接不停下一步就行，全部使用默認(rèn)選項(xiàng)即可。下載完成后打開CMD，node -v檢測(cè)是否安裝成功，安裝成功則會(huì)顯示nodejs版本號(hào)。

安裝uglify插件

在cmd命令行執(zhí)行：npm install uglify-js -g

開始?jí)嚎s

壓縮的時(shí)候?qū)⑾旅娴拇a拷貝下來，然后生成bat文件，再運(yùn)行bat文件(有些電腦可能需要windows管理員身份運(yùn)行)，然后依次輸入當(dāng)前的JS文件目錄。再輸入生成輸出壓縮后JS的目錄即可。

@ECHO OFF
setlocal enabledelayedexpansion
set source_path=%1
set target_dir=%2

IF [%1]==[] ( 
      rem echo please input javascript file or directory 
      set /p  source_path=please input javascript file or directory:
)

IF [%2]==[] ( 
      rem echo please input output directory 
      set /p target_dir=please input output directory:
) 
rem source path exists?
FOR %%i IN (%source_path%) DO SET FileAttrib=%%~ai

if "%FileAttrib%" equ ""   (     
      rem not found file attribute, source path not exist
      echo source path ^(%source_path%^) doesn't exist
      exit /b 0
)   ELSE   IF "%FileAttrib:~0,1%" equ "d" (
      rem source path is directory and not end with \, append \ to source path
      IF %source_path:~-1% neq \ (
            set source_path=%source_path%\
      )   
) 
echo source path is  %source_path%  

rem target path exists?
FOR %%i IN (%target_dir%) DO SET fa=%%~ai

IF   [%fa%]==[]   (
    rem target path not exist, make it
    mkdir %target_dir%
      
)  

IF %target_dir:~-1% neq \ (
      rem append \ to target path
      set target_dir=%target_dir%\
)
   
echo target path is %target_dir% 

IF [%FileAttrib:~0,1%]==[d] (
 
    for /r %source_path% %%I in (*.js) do ( 

      set file_name=%%~nI
      set parent=%%~dpI
      set target_parent=%target_dir%!parent:%source_path%=!
      if not exist !target_parent!  mkdir !target_parent!
      cd !target_parent!

      if [!file_name:~-4!] neq [.min] (      

            set w= uglifyjs %%I -m -c -O ascii_only=true -o   !target_parent!%%~nI.min.js 
            rem uglify .js file
            echo uglifyjs from "%%I" to "!target_parent!%%~nI.min.js"
            start cmd /c  "!w!"
      )  else (
           rem copy min.js file
           echo copy file from "%%~dpnI.js" to "!target_parent!%%~nI.js" 
           start cmd /c "copy  %%~dpnI.js  !target_parent!%%~nI.js" 
      )
       
    )
) else (
    for %%I in (%source_path%) do (
        IF    "%%~xI" EQU ".js"  (    
             set file_name=%%~nI
              if [!file_name:~-4!] neq [.min] (   
                  rem uglify .js file
                  set val=%target_dir%%%~nI.min.js       
                  echo uglifyjs from "%%I" to "!val!"
                  start cmd /c "uglifyjs  %%I  -m -c  -O ascii_only=true -o   !val!"
                  
              ) else (
                  rem copy min.js file
                  echo copy file from "%%I" to "%target_dir%%%~nI.js"
                  start cmd /c "copy  %%I %target_dir%%%~nI.js"  
              )
        
        )
    )
      
)
echo done

源碼地址

https://github.com/toutouge/javademosecond/tree/master/hellolearn

補(bǔ)充：JS壓縮方法及批量壓縮

壓縮JS的好處（1）減小文件的體積；
（2）減小網(wǎng)絡(luò)傳輸量和帶寬占用；
（3）減小服務(wù)器的處理的壓力；
（4）提高頁面的渲染顯示的速度。安裝uglify插件

# 執(zhí)行命令： 
npm install uglify-js -g

單文件壓縮

# 使用方法：uglifyjs + 要壓縮的js文件名稱 +? -o +? 壓縮后js文件名稱
uglifyjs vendor.js -o vendor.min.js

壓縮后文件體積明顯變?。。?！

批量壓縮方法

（1）新建txt文件，內(nèi)容如下

@echo off
:: 設(shè)置壓縮JS文件的根目錄，腳本會(huì)自動(dòng)按樹層次查找和壓縮所有的JS（注意路勁中不能有空格）
SET JSFOLDER=D:\uglifyDestination
echo 正在查找JS文件
chdir /d %JSFOLDER%
for /r . %%a in (*.js) do (
    @echo 正在壓縮 %%~a ...
    uglifyjs %%~fa  -m -o %%~fa
)
echo 完成!
pause & exit

（2）修改文件為.bat文件
（3）將需要壓縮的js文件放置指定目錄（例：D:\uglifyDestination）
（4）雙擊bat文件開始?jí)嚎s

到此這篇關(guān)于本地JS文件批量壓縮的文章就介紹到這了,更多相關(guān)S文件批量壓縮內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章: