轻松压缩JS文件

JavaScript039

轻松压缩JS文件,第1张

在任意文件夹下按住shift按键的同时，点击鼠标右键 打开powershell命令窗口 执行命令： npm install uglify-js -g 首先，打开cmd 其次，查找要压缩的js文件，查找方法如下： 1、输入文件所在位置 例如，我需要压缩的文件在E盘中，就输入  e: 2、输入：cd + js文件所在位置 例如，我需要压缩的js文件在：E:\electron-vue\topology\static\new_node_modules\topology-vue 就执行：cd electron-vue\topology\static\new_node_modules\topology-vue 3、输入：uglifyjs + 要压缩的js文件名称 +  -o +  压缩后js文件名称 例如，我要将topology-vue.umd.js文件压缩成topology-vue.umd.min.js 就执行：uglifyjs topology-vue.umd.js -o topology-vue.umd.min.js 你没看错！ 就是这么简单！！ 将JS文件进行压缩，让你的程序快马加鞭地跑起来吧！！！

这段时间因为免费试用了 https://free.aliyun.com/ 一台阿里云的服务器，配置是 2核4G 2M，

因为带宽太低了，每次在第一次加载的时候太慢了，通过F12调试，发现主要是因为加载的 js 过大而引起的。因此本文将主要讲解Vue项目打包后js、css、svg等文件过大的解决办法。

通过引入 compression-webpack-plugin 插件来打包，然后开启 nginx gzip 来解决问题

配置 compression-webpack-plugin 前后打包对比，我们查看 dist目录，能够发现大于10KB的 js ， css 等文件已经被压缩了

.js 是JavaScript的源码文件。.js文件可读性好，便于调试和修改，但是其相对压缩后的.min.js所占用空间较大

.min.js 是JavaScript的源码文件压缩之后产生的文件。.min.js文件可读性差，所占用空间相对较小，可用于源码防窃

将.js压缩为.min.js主要包括两个方面：去掉无用的空格、换行符号、注释等，从而压缩js文件大小；将原.js中变量和函数的命名修改为没有实际意义的名称，进行语句的等价替换，如条件判断修改为使用三目运算符，从而尽可能实现源码防窃

JavaScript的代码压缩工具