npm install -g rollup
import path from "path"; console.log("hello rollop", path.join("", "hello"));
rollup -i index.js --file dist.js --format umd
只会打包我们用到的代码,没有用到的不会打包
export const funA = () => { console.log("a"); }; export const funB = () => { console.log("b"); };
import { funA } from "./a"; funA(); console.log("hello rollup");
rollup -i index.js --file dist.js --format es
输出代码,代码进行了合并,并且只打包了用到的代码
const funA = () => { console.log("a"); }; funA(); console.log("hello rollop");
index.js 文件
import path from "path"; import { funA } from "./a"; funA(); console.log("hello rollop", path.join(__dirname, "/hello")); export const x = 12;
a.js 文件
export const funA = () => { console.log("a"); }; export const funB = () => { console.log("b"); };
rollup [options] <entry file> 选项 输入文件 --help 帮助文档 -v, --version 查看版本 -i, --input <filename> 输入单个文件 -f, --format <format> 输出格式 -o, --file <output> 输出单个文件 -d, --dir <dirname> 输出多个文件 -w, --watch 监听文件改变,并重新打包 -c, --config <filename> 指定配置文件使用 --environment <values> 指定环境变量
rollup -i index.js -i a.js --dir dist
rollup -i index.js --format iife index.js → stdout... Creating a browser bundle that depends on "path". You might need to include https://github.com/snowpackjs/rollup-plugin-polyfill-node var index = (function (exports, path) { 'use strict'; function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; } var path__default = /*#__PURE__*/_interopDefaultLegacy(path); const funA = () => { console.log("a"); }; funA(); console.log("hello rollop", path__default["default"].join(__dirname, "/hello")); const x = 12; exports.x = x; Object.defineProperty(exports, '__esModule', { value: true }); return exports; })({}, path);
rollup -i index.js --format cjs index.js → stdout... 'use strict'; Object.defineProperty(exports, '__esModule', { value: true }); var path = require('path'); function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; } var path__default = /*#__PURE__*/_interopDefaultLegacy(path); const funA = () => { console.log("a"); }; funA(); console.log("hello rollop", path__default["default"].join(__dirname, "/hello")); const x = 12; exports.x = x;
rollup -i index.js --format es index.js → stdout... import path from 'path'; const funA = () => { console.log("a"); }; funA(); console.log("hello rollop", path.join(__dirname, "/hello")); const x = 12; export { x };
rollup -i index.js --format umd --name index index.js → stdout... (function (global, factory) { typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('path')) : typeof define === 'function' && define.amd ? define(['exports', 'path'], factory) : (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.index = {}, global.path)); })(this, (function (exports, path) { 'use strict'; function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; } var path__default = /*#__PURE__*/_interopDefaultLegacy(path); const funA = () => { console.log("a"); }; funA(); console.log("hello rollop", path__default["default"].join(__dirname, "/hello")); const x = 12; exports.x = x; Object.defineProperty(exports, '__esModule', { value: true }); }));
rollup -i index.js --file dist.js --format umd --name index
export default { input: "index.js", output: { file: "dist.js", format: "umd", name: "index", }, };
rollup --config rollup.config.js
在配置文件中获取
// rollup.config.js console.log(process.env.MODE); const mode = process.env.MODE; const isLocal = mode === "local"; export default { input: "index.js", output: { file: "dist.js", format: isLocal ? "es" : "umd", name: "index", }, };
rollup --config rollup.config.js --environment MODE:local
import path from "path"; import { funA } from "./a"; import pkg from "./package.json"; console.log(pkg); funA(); console.log("hello rollop", path.join(__dirname, "/hello")); export const x = 12;
npm install @rollup/plugin-json --save-dev npm install rollup
./node_modules/.bin/rollup --config rollup.config.js --plugin json