主要实现了在非构建环境下，无需配置，只通过命令对 js 或 ts 文件进行打包、babel 转译、压缩、混淆等功能
使用 rollup 打包压缩 js，如果入口是 typescript 文件，那么会自动开启 ts 打包。
-input/-i 文件入口
-output/-o 输出文件
-module/-m 模块类型(默认umd)
-help/-h 帮助
-terser/-t 普通压缩
-babel/-b 开启babel(es6+转es5)
-libraryName/-name 打包后的名字,默认是文件名(umd模式)
-uglify/-u 开启uglifyjs(丑化js)
-uglifyDropDebugger/-udd 移除debugger,需开启uglify
-uglifyDropConsole/-udc 移除console,需开启uglify
-eval/-e eval parker混淆模式
npm i -g @mxssfd/bundle-cli
bundle-cli inputPath outputPath
如果输出文件名不填，则为输入文件名.min.js 或
bundle-cli -input path -output path
bundle-cli inputPath outputPath -terser
bundle-cli inputPath outputPath -babel
注意!!!!! es7 的 async await 转成 es5 需要一个 polyfill，否则会报错
在前面加上regenerator-runtimepolyfill 库即可
<script src="https://cdn.jsdelivr.net/npm/[email protected]/runtime.min.js"></script>bundle-cli inputPath outputPath -uglify
去除 debugger
bundle-cli inputPath outputPath -udd
去除 console
bundle-cli inputPath outputPath -udd
eval 混淆
bundle-cli inputPath outputPath -eval
默认使用的是umd模块打包，可以选择es,amd,commonjs等模块类型打包。
umd模式下会生成libraryName暴露出模块名，如vue会在window下暴露出Vue这个库名,然后可以使用类似Vue.createApp等方法
如果umd模式下原文件未export暴露出函数，那么不会生成libraryName
注意!!!!! 部分库会和umd冲突，如monaco-editor,此时使用es打包即可，不过es打包会污染window, 不影响的情况下还是推荐umd
设置>外部工具>添加外部工具
并依次填入
名称：bundle-cli(随意)
程序：必须从npm全局安装目录下查找到bundle-cli.cmd
实参：$FilePath$ -b -u -udc -udd -e
工作目录：$FileDir$
$FilePath$为webstorm当前打开的文件或目录下鼠标选中的文件
$FileDir$为webstorm当前打开的文件所在目录，供babel使用
然后打开要打包的文件，右键选择外部工具|external tools找到bundle-cli鼠标点击就能打包了
添加快捷键：打开设置>键盘映射找到外部工具>external tools>bundle-cli，添加快捷键，然后就可以通过设置的快捷键一键打包
快捷键ctrl + shift + b打开任务弹窗，新建一个任务并填写以下
{
"version": "2.0.0",
"tasks": [
{
"type": "shell",
"group": "build",
"problemMatcher": [],
"label": "bundle-cli",
"command": "bundle-cli ${file} -b -u -udc -udd -e"
}
]
}${file}为vscode当前打开的文件
打开要打包的文件，然后再次使用ctrl + shift + b打开任务窗口，并选中刚才设置的任务并选中bundle-cli，那么就命令就完成了。
使用编辑器快捷键免除了每次都要输入繁琐的命令
更多配置可参考 vscode 官方配置
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent