Rollup 打包一个 JavaScript 项目

export default {
  input: "./src/FFCesium/core/index.js", // 输入文件
  output: {
    file: "public/lastVersion/FFCesium.confuse.js", // 输出文件
    //format: "cjs", // 打包格式为cjs
    format: "es",
    exports: "default", // 或者 'default'
  },
  external: ["cesium", "cesium-navigation-es6", "@turf/turf", "vue"],
  plugins: [
    Obfuscator(),
    nodeResolve(), // 解析npm模块
    commonjs(), // 将CommonJS模块转为可被Rollup处理的格式
    image(), //支持打包图片
    postcss({
      extract: false, // 提取到单独的 CSS 文件
      minimize: true, // 压缩 CSS
    }), //支持打包css
  ],
};

1. input: 指定打包的入口文件路径，这里是 ./src/FFCesium/core/index.js，即项目的主入口文件。

2. output: 指定打包后输出的文件配置。

   • file: 输出文件的路径为 public/lastVersion/FFCesium.confuse.js。
   • format: 输出的模块格式为 ES Module ("es")，这种格式适用于现代 JavaScript 模块系统，支持树摇和异步加载。
   • exports: 指定输出的方式为 default，表示默认导出方式。这对于 ES Module 格式来说是默认的导出方式。

3. external: 声明外部依赖，这些依赖不会被打包进最终的输出文件中，而是在运行时从外部引入。在这个配置中，外部依赖包括 cesium, cesium-navigation-es6, @turf/turf, 和 vue。

4. plugins: 插件列表，用于处理不同类型的文件和资源。

   • Obfuscator(): 这个插件可能是自定义的，用于混淆代码，增强代码的安全性。
   • nodeResolve(): 解析 Node.js 模块，使得 Rollup 能够处理引入的 npm 包。
   • commonjs(): 将 CommonJS 模块转换为 ES Module 格式，以便 Rollup 可以处理它们。
   • image(): 支持打包图片资源，可能是自定义的处理图片的插件。
   • postcss(): 处理 CSS 文件的插件，这里设置了不提取到单独的 CSS 文件，而是内联到 JavaScript 文件中，并启用了 CSS 的压缩功能。

这个配置文件的目的是将项目中的 JavaScript 和相关资源打包成一个单独的 JavaScript 文件，以 ES Module 的格式输出到 public/lastVersion/FFCesium.confuse.js 文件中。配置中使用了一些常见的插件来处理 JavaScript 模块、图片和 CSS 等资源，确保打包后的文件能够在浏览器或 Node.js 环境中运行和加载。

需要的资源

import { nodeResolve } from "@rollup/plugin-node-resolve";
import commonjs from "@rollup/plugin-commonjs";
import image from "@rollup/plugin-image";
import postcss from "rollup-plugin-postcss";
import Obfuscator from "rollup-plugin-obfuscator";

在package.json中配置

"scripts": {
    "dev": "vite ",
    "build": "vite build",
    "preview": "vite preview",
    "pack": "rollup --config bin/pack/rollup.config.js",
    "packmin": "rollup --config bin/pack/rollup.config.min.js",
    "packconfuse": "rollup --config bin/pack/rollup.config.confuse.js",
    "packconfusemin": "rollup --config bin/pack/rollup.config.confuse.js && rollup --config bin/pack/rollup.config.confuse.min.js"
  },

rollup ---config +路径。