如何在vite.js中通过rollup-plugin-copy排除子目录?
Vite集成PDFTron时无法排除子目录缩小构建体积的解决方案
我正在将PDFTron集成到现有Vite项目中,按照官方文档复制资源后构建体积超过300MB,想排除不必要的core/pdf/full目录来缩小体积,但尝试多种rollup-plugin-copy的排除写法都无效,以下是我的配置文件:
vite.config.js
import copy from "rollup-plugin-copy"; const outputDir = 'build'; /** * @type {import('vite').UserConfig} */ const config = { build: { outDir: outputDir, emptyOutDir: false, assetsDir: '.', lib: { entry: 'index.js', name: 'my-lib', fileName: 'my-lib.js', formats: ['es'] }, rollupOptions: { output: { entryFileNames: `my-lib.js`, chunkFileNames: `[name].js`, assetFileNames: `[name].[ext]` }, plugins: [copy({ targets: [ { src: ['node_modules/@pdftron/webviewer/public/*', '!core/pdf/full/*'], dest: outputDir + '/pdftron1' }, { src: ['node_modules/@pdftron/webviewer/public', '!node_modules/@pdftron/webviewer/public/core/pdf/full/*'], dest: outputDir + '/pdftron2' }, { src: ['node_modules/@pdftron/webviewer/public', '!node_modules/@pdftron/webviewer/public/core/pdf/full'], dest: outputDir + '/pdftron3' }, { src: ['node_modules/@pdftron/webviewer/public', '!node_modules/@pdftron/webviewer/public/core/pdf/full/'], dest: outputDir + '/pdftron4' }, { src: ['node_modules/@pdftron/webviewer/public', '!node_modules/@pdftron/webviewer/public/core/pdf/full/**'], dest: outputDir + '/pdftron5' }, ] }) ] }, }, } export default config
package.json
{ "name": "pdftron-vite-example", "version": "1.0.0", "scripts": { "build": "vite build" }, "dependencies": { "@pdftron/webviewer": "8.7.0" }, "devDependencies": { "vite": "^2.9.13", "rollup-plugin-copy": "^3.3.0" } }
问题原因
你的配置失效核心是rollup-plugin-copy的glob匹配规则使用不当:
- 部分写法中
src的匹配范围太窄(比如public/*仅匹配public下的直接子项,无法遍历深层目录,导致排除规则无法触达目标路径) - 排除规则的路径层级与
src的匹配逻辑不对应,且未使用插件推荐的排除方式
修复后的配置
修改rollup-plugin-copy的目标配置,使用完整的glob路径覆盖所有层级文件,并通过exclude字段精准排除目标目录:
import copy from "rollup-plugin-copy"; const outputDir = 'build'; /** * @type {import('vite').UserConfig} */ const config = { build: { outDir: outputDir, emptyOutDir: false, assetsDir: '.', lib: { entry: 'index.js', name: 'my-lib', fileName: 'my-lib.js', formats: ['es'] }, rollupOptions: { output: { entryFileNames: `my-lib.js`, chunkFileNames: `[name].js`, assetFileNames: `[name].[ext]` }, plugins: [ copy({ targets: [ { // 匹配public目录下所有层级的文件和子目录 src: 'node_modules/@pdftron/webviewer/public/**/*', // 精准排除core/pdf/full下的所有内容 exclude: 'node_modules/@pdftron/webviewer/public/core/pdf/full/**/*', dest: `${outputDir}/pdftron`, // 保留原目录结构,避免文件混乱 flatten: false } ], // 可选:确保匹配隐藏文件(如果有需要) globOptions: { dot: true } }) ] }, }, } export default config
更可靠的官方优化方案
优先使用PDFTron官方提供的优化脚本,比手动排除目录更彻底且不易出错。修改package.json的脚本,在构建前自动运行优化:
{ "scripts": { "prebuild": "npx @pdftron/webviewer optimize --public-dir node_modules/@pdftron/webviewer/public --exclude=pdf/full", "build": "vite build" } }
内容的提问来源于stack exchange,提问作者samjaf
相关产品推荐
相关产品推荐

