Rollup 是一个 JavaScript 模块打包器
中文网:https://www.rollupjs.com/
英文网:https://www.rollupjs.org/
安装
npm install --global rollup
main.js
console.log("hello rollup");
打包
rollup --help # 可以查看
# 浏览器
rollup main.js --file bundle.js --format iife
打包结果
bundle.js
(function () {
"use strict";
console.log("hello rollup");
})();
src/main.js
// src/main.js
import foo from "./foo.js";
export default function () {
console.log(foo);
}
src/foo.js
// src/foo.js
export default "hello world!";
打包
rollup src/main.js -o bundle.js -f cjs
rollup.config.js
// rollup.config.js
export default {
input: "src/main.js",
output: {
file: "bundle.js",
format: "cjs",
},
};
打包
# 默认使用rollup.config.js
rollup -c
https://github.com/rollup/plugins/
npm init -y
npm install --save-dev rollup-plugin-json
从 json 文件中读取数据
package.json
{
"name": "rollup-demo",
"version": "1.0.0",
"description": "",
"main": "",
"dependencies": {},
"devDependencies": {
"rollup-plugin-json": "^4.0.0"
},
"scripts": {
"build": "rollup -c"
},
"keywords": [],
"author": "",
"license": "ISC"
}
src/main.js
// src/main.js
import { version } from "../package.json";
export default function () {
console.log("version " + version);
}
配置文件加入 JSON 插件
rollup.config.js
// rollup.config.js
import json from "rollup-plugin-json";
export default {
input: "src/main.js",
output: {
file: "bundle.js",
format: "cjs",
},
plugins: [json()],
};
编译
npm run build
编译结果
"use strict";
var version = "1.0.0";
// src/main.js
function main() {
console.log("version " + version);
}
module.exports = main;
配置打包和开发环境启动项
package.json
{
"name": "rollup-demo",
"version": "1.0.0",
"description": "",
"main": "",
"dependencies": {},
"devDependencies": {
"rollup-plugin-json": "^4.0.0"
},
"scripts": {
"dev": "rollup --config --watch",
"build": "rollup --config"
},
"keywords": [],
"author": "",
"license": "ISC"
}
配置即使打包
rollup.config.js
// rollup.config.js
import json from "rollup-plugin-json";
export default {
input: "src/main.js",
output: {
file: "bundle.js",
format: "iife",
},
plugins: [json()],
watch: {
exclude: "node_modules/**",
},
};
不错的文章
深入学习rollup来进行打包