使用rollup打包TS文件
安装依赖:
全局安装rollup npm install rollup-g
安装TypeScript npm install typescript -D
安装TypeScript 转换器 npm install rollup-plugin-typescript2 -D
安装代码压缩插件 npm install rollup-plugin-terser -D
安装rollupweb服务 npm install rollup-plugin-serve -D
安装热更新 npm install rollup-plugin-livereload -D
安装配置环境变量用来区分本地和生产 npm install cross-env -D
步骤:
1.安装依赖
2.npm init -y 创建配置package.json文件
3.创建 src public rollup.config.js文件
4.配置 rollup.config.js
package.json文件:
{
"name": "rollupTs",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"build": "cross-env NODE_ENV=production rollup -c",
"dev": "cross-env NODE_ENV=development rollup -c"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"cross-env": "^7.0.3",
"rollup-plugin-livereload": "^2.0.5",
"rollup-plugin-node-resolve": "^5.2.0",
"rollup-plugin-replace": "^2.2.0",
"rollup-plugin-serve": "^1.1.0",
"rollup-plugin-terser": "^7.0.2",
"rollup-plugin-typescript2": "^0.31.1",
"typescript": "^4.5.5"
}
}
rollup.config.js文件
import path from "path"
import livereload from "rollup-plugin-livereload"
import serve from "rollup-plugin-serve"
import { terser } from "rollup-plugin-terser"
import ts from "rollup-plugin-typescript2"
export default {
input: "./src/index.ts",
output: {
file: path.resolve(__dirname, "./dist/index.js"),
sourcemap: true,
format: "umd",
},
plugins: [
ts(),
livereload(),
terser(),
serve({
open: true,
port: 8080,
openPage: "/public/index.html"
}),
]
}
console.log(process.env);