javascript技巧

关注公众号 jb51net

关闭
首页 > 网络编程 > JavaScript > javascript技巧 > js文件批量压缩

本地JS文件批量压缩的操作方法

作者:请叫我头头哥

这篇文章主要介绍了本地JS文件批量压缩的方法,由于之前压缩的JS文件都比较少,都是手动压缩的。这次需要压缩的文件比较多,所以用了批量压缩,特此记录一下,方便大家和自己以后再用到的时候备忘

最近在维护一个小后台项目,有段JS需要压缩上传到CDN存储服务器。由于之前压缩的JS文件都比较少,都是手动压缩的。这次需要压缩的文件比较多,所以用了批量压缩。特此记录一下,方便大家和自己以后再用到的时候备忘。

准备工作

安装nodejs

首先在本地安装node.js和npm,一般npm集成于nodejs,即安装nodejs,同时也安装了npm。node.js下载地址,下载以后直接不停下一步就行,全部使用默认选项即可。下载完成后打开CMD,node -v检测是否安装成功,安装成功则会显示nodejs版本号。

安装uglify插件

在cmd命令行执行:npm install uglify-js -g

开始压缩

压缩的时候将下面的代码拷贝下来,然后生成bat文件,再运行bat文件(有些电脑可能需要windows管理员身份运行),然后依次输入当前的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

补充:JS压缩方法及批量压缩

压缩JS的好处(1)减小文件的体积;
(2)减小网络传输量和带宽占用;
(3)减小服务器的处理的压力;
(4)提高页面的渲染显示的速度。安装uglify插件

# 执行命令: 
npm install uglify-js -g

单文件压缩

# 使用方法:uglifyjs + 要压缩的js文件名称 +  -o +  压缩后js文件名称
uglifyjs vendor.js -o vendor.min.js

压缩后文件体积明显变小!!!

批量压缩方法

(1)新建txt文件,内容如下

@echo off
:: 设置压缩JS文件的根目录,脚本会自动按树层次查找和压缩所有的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文件开始压缩

到此这篇关于本地JS文件批量压缩的文章就介绍到这了,更多相关S文件批量压缩内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

您可能感兴趣的文章:
阅读全文