npm 作为世界上最大的软件包管理器,为前端开发者提供了便利。如果要打包 JavaScript 应用程序, rollup 是一个很不错的选择。而 bubbleup-plugin-build-rollup 则是一个编译器,可以将你的 JavaScript 应用程序打包并将其输出到 dist 目录。
安装
bubbleup-plugin-build-rollup 可以通过 npm 安装。
npm install --save-dev bubbleup-plugin-build-rollup
配置
要配置 bubbleup-plugin-build-rollup,你需要创建一个 rollup.js
文件,然后添加以下内容:
-- -------------------- ---- ------- ------ ------ ---- --------- ------ ----- ---- ---------------------- ------ -------- ---- ------------------------- ------ ------- ---- ----------------------------- ------ ------- ---- ------------------------ ------ - ------ - ---- ----------------------- ------ --- ---- ----------------- ------ ------- ----- ---------- - ----- ------ - ----- --------------- ------ ----------------- -------- - ---------- ----------- --------- ----------------------- ------------------------------------- --- ------- -------- ------------------ --------------- ----- --- --------- -- --- ----- -------------- ----- ------------------- ------- ----- ----- --------- --- -
使用
在 package.json
文件中添加以下内容:
{ "name": "my-app", "private": true, "scripts": { "build": "bubbleup-plugin-build-rollup" } }
运行
运行 npm run-script build
打包你的 JavaScript 应用程序。当运行完毕后,你将在 dist
目录下看到你的 JavaScript 应用程序的打包结果。
示例
我们来看一个简单的示例,该示例将计算斐波那契数列。
// src/fibonacci.js export default function fibonacci(n) { return n <= 1 ? n : fibonacci(n - 1) + fibonacci(n - 2); } // src/index.js import fibonacci from './fibonacci.js'; export default fibonacci(7);
运行 npm run-script build
后,我们可以在 dist/bundle.js
文件中找到以下输出:
function fibonacci(n){return n<=1?n:fibonacci(n-1)+fibonacci(n-2)}fibonacci(7);
总结
使用 bubbleup-plugin-build-rollup 打包 JavaScript 应用程序是一件非常简单的事情。通过配置 rollup.js
,你可以轻松地将你的应用程序打包,并将其输出到指定的目录中。希望本文能够帮助你更好地使用这个工具。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/60066c8cccdc64669dde548a