在前端开发中，JavaScript 是我们主要的编程语言，而使用 ECMAScript6 语法编写代码能够更加高效、简洁且易于维护。但在部署项目时，我们会遇到一个问题：JavaScript 代码文件一般都是存在服务器上的，如果代码存在注释、空格、换行等就会增加文件的大小，影响加载时间。
为了解决这个问题，我们需要将代码进行压缩和混淆，使文件变小、避免暴露源代码以及更加难以被恶意利用。而 babel-plugin-minify-numeric-literals 这个 NPM 包就能对 JavaScript 代码中的数字进行简化，同时压缩代码文件的大小。本文就将详细介绍该 NPM 包的使用。
安装
在使用该 NPM 包前，我们首先需要安装它。通过以下命令安装：
npm install babel-plugin-minify-numeric-literals --save-dev
用法
安装完毕后，我们就可以在项目中使用该 NPM 包了。使用步骤如下：
- 在项目根目录下创建
.babelrc文件。如果已经有了，直接在文件中添加以下代码：
{
"plugins": ["minify-numeric-literals"]
}- 在项目中安装 Babel 并选择需要的 preset。例如，我们选择
babel-preset-env：
npm install babel-core babel-preset-env --save-dev
- 修改
package.json的scripts部分进行转换。
例如，我们将以下代码添加到 scripts 中：
"build": "babel src -d dist",
这样，src 文件夹下的 ES6 语法的 JavaScript 代码会被转译并放在 dist 文件夹中。
- 运行转换器。
使用以下命令开启转换器：
npm run build
至此，即可完成将代码中的数字进行简化，同时达到压缩文件大小的目的。
示例代码
下面给出一个示例代码，说明在什么情况下我们可以使用该 NPM 包。我们先看一下下面的示例代码：
const a = 123_456; const b = 1.23e6; const c = 0b110010;
在这个示例代码中，我们使用了下划线、指数以及二进制的数字表达方式。如果直接压缩代码，生成的压缩版代码如下：
const a=123456;const b=1.23e6;const c=50;
可以看到，指数和二进制标识符被正确地保留下来了。然而，使用下划线的数字表达方式却没有被压缩，而且生成的代码仍然有空格、变量名，以及其他附加内容。
为了优化代码的压缩效果，我们可以使用 babel-plugin-minify-numeric-literals 这个 NPM 包，让上面的代码更加简洁：
const a=123456;const b=1.23e6;const c=50;
可以看到，通过这个 NPM 包，下划线的数字表达方式和空格、变量名等也被正确地压缩了。这能够很好地解决代码体积过大的问题，并且更好地保护了我们的源代码。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/40121