原因：将入口文件 转为 esm 和 umd 两种格式，要配置 rollup

Rollup 已内置到 vite 工具中，

命令行打包，参数多，麻烦——》解决：创建配置文件，js 写的，rollup.config.js

---

配置 rollup.config.js文件：

input 输入文件

output 输出文件：file 文件路径、format 格式

Rollup 运行配置文件：npx rollup --config rollup.config.js  

导出格式：

exports.xxx = xxx => common.js的格式

export { xxx } => es module 格式 ——》与平时写的代码无异。

如何测试导出的格式：

1. 修改导入文件，用于测试导出格式

2. 运行代码 npx rollup --config rollup.config.js  

3. ①配置格式 cjs，exports.xxx = xxx => common.js的格式

②配置 es module 格式，

 export{ xxx }  => es module 格式 ——》与平时写的代码无异。

---

 使用插件，打包过程中 更改 rollup 的行为——》使用 rollup 官方插件，在 rollup.config.js 中配置

复杂项目要灵活处理，有时直接处理 会报错。

可以使用插件，在打包的关键过程中 更改 rollup的行为。

 Rollup 官方支持的插件

 例子：官方的 json 插件，支持将 json 文件转为 es6 modules

安装：npm install @rollup/plugin-json --save-dev

使用：在配置文件中 rollup.config.js 中 配置。

如 json：添加 import json from '@rollup/plugin-json';，并添加插件 plugins:[ json() ] 选项。

示范：测试，读取 json 文件中的 version字段

  导出的文件，成功取到version字段

---

vite 创建生产版本：1. 库模式  2. 自定义构建

库模式构建：vite.config.js 文件下 -> build选项->  lib 选项 -> entry 入口文件、name 暴露的全局变量、fileName 包文件名、formats 格式

 配置完成后，重新运行 npm run build-only

---

自定义构建：vite.config.js -> build选项 -> rollupOptions 选项

不打包的依赖：处理不想打包进库的依赖

问题： 打包文件过大

解决：将部分不需要用的依赖摘出去，如vue

步骤：vite.config.ts -> build 选项 ->  添加 rollupOptions 选项 -> external: [' 要排除在外的依赖 ']

例子：不打包 vue 依赖，重新运行：npm run build-only，打包体积显著减少。

---

报错：output.exports: "named" 和 output.globals全局变量名称——》解决：在vite.config.ts文件中，build下 配置 rollupOptions选项，里头添加 output字段，进行exports 和 globals 的配置。

步骤：vite.config.ts -> build 选项 ->  添加 rollupOptions 选项 -> output选项 -> 添加 exports 表示既有具名导出也有默认导出，globals 给 vue 添加全局变量名称

注： 每一个外部依赖，都要有一个全局变量名称。