rollup-plugin-copy在 vite@5.0.11中不生效解决办法

在打包的时候, 我们需要将一些文件copy到 打包后的目录.

使用 vite 可以很方便的复用 rollup的插件生态, 但是发现一个小小的问题,需要我们自己注意一下

环境说明

sql 复制代码
node: 20.10.0
rollup-plugin-copy  3.5.0
vite  5.0.11

截止到 2024-01-09 ,插件均为最新版本

安装

shell 复制代码
pnpm add rollup-plugin-copy vite -D

使用

不生效的写法

js 复制代码
import { defineConfig } from 'vite'
import copy from 'rollup-plugin-copy'

export default defineConfig({
    build: {
        outDir: 'lib',
        lib: {
          entry: resolve('./src/index.js'),
          name: 'test-ui',
          fileName: 'ems'
        },
    }),
    plugins: [
        ...其他插件
        copy({
          targets: [
            { src: './package.json', dest: './lib' }
          ]
        }),

    ]
})

发现在 输出目录 lib下面使用没有 要搬运的文件 package.json。

可能是 rollup-plugin-copy 的版本与 rollup 存在差异, 主要应该是 rollup hooks 的差异, 现在,我们将执行时机改为 由 buildEnd 改为 closeBundle

buildEndrollup-plugin-copy 使用的默认的 hook

  • buildEnd 执行时机:在 Rollup 完成产物但尚未调用 generatewrite 之前调用;也可以返回一个 Promise。如果在构建过程中发生错误,则将其传递给此钩子。

  • closeBundle: 可用于清理可能正在运行的任何外部服务。Rollup 的 CLI 将确保在每次运行后调用此钩子,但是 JavaScript API 的用户有责任在生成产物后手动调用 bundle.close()。因此,任何依赖此功能的插件都应在其文档中仔细提到这一点 - 需要手动维护资源的释放

修改为:

js 复制代码
 plugins: [
     ...其他插件
    copy({
      // 显示日志
      verbose: true,
      hook: 'closeBundle',
      targets: [
        { src: './package.json', dest: './lib' }
      ]
    }),
  ]
相关推荐
前端一课24 分钟前
Vue3 的 Composition API 和 Options API 有哪些区别?举例说明 Composition API 的优势。
前端
用户479492835691525 分钟前
都说node.js是事件驱动的,什么是事件驱动?
前端·node.js
晴殇i25 分钟前
前端架构中的中间层设计:构建稳健可维护的组件体系
前端·面试·代码规范
申阳44 分钟前
Day 7:05. 基于Nuxt开发博客项目-首页开发
前端·后端·程序员
Crystal3281 小时前
App端用户每日弹出签到弹窗如何实现?(uniapp+Vue)
前端·vue.js
摸着石头过河的石头1 小时前
Service Worker 深度解析:让你的 Web 应用离线也能飞
前端·javascript·性能优化
用户4099322502121 小时前
Vue 3中watch侦听器的正确使用姿势你掌握了吗?深度监听、与watchEffect的差异及常见报错解析
前端·ai编程·trae
1024小神1 小时前
Xcode 常用使用技巧说明,总有一个帮助你
前端
molly cheung1 小时前
Vue3:watch与watchEffect的异同
vue.js·watch·store·watcheffect
政采云技术2 小时前
音视频通用组件设计探索和应用
前端·音视频开发