uni-app H5打包时vite.config.js里插件的closeBundle代码无法正常运行

uni-app H5打包时vite.config.js里插件的closeBundle代码无法正常运行

开发环境 版本号 项目创建方式
Mac 14.4.1 HBuilderX

操作步骤：

const deleteIconPlugin = () => {
return {
name: 'deleteIcon',
apply: 'build',
closeBundle() {
console.log(1);
setTimeout(function() {
console.log(2); // 此行未正常打印
}, 200);
const iconPath = path.resolve(__dirname, './unpackage/dist/build/web/static/icon/')
if (fs.existsSync(iconPath)) {
fs.removeSync(iconPath)
}
}
}
}

预期结果：

能正常运行

实际结果：

不能正常运行

bug描述：

H5打包的时候vite.config.js里的closeBundle钩子函数中的回调代码无法正常运行， 如下面代码 console.log(1)正常输出，console.log(2)没正常输出，在以前3.xx版本中都是可以正常输出的。是不是编辑器修改了啥？不支持异步的内容回调了？ 如果新版本不支持异步的代码这将导致好多回调型的功能都没法写。。。 但我试了一下generateBundle函数，发现又是正常支持异步函数的。所以我懵了⊙▃⊙。。。

const deleteIconPlugin = () => {
return {
name: 'deleteIcon',
apply: 'build',
closeBundle() {
console.log(1);
setTimeout(function() {
console.log(2); // 此行未正常打印
}, 200);
const iconPath = path.resolve(__dirname, './unpackage/dist/build/web/static/icon/')
if (fs.existsSync(iconPath)) {
fs.removeSync(iconPath)
}
}
}
}

更多关于uni-app H5打包时vite.config.js里插件的closeBundle代码无法正常运行的实战教程也可以访问 https://www.itying.com/category-93-b0.html

2 回复

我后来发现只要我在钩子函数的末尾主动加个耗时任务，前面的异步任务又能进行下去了，比如在closeBundle()函数末尾添加如下代码： for (var i = 0; i < 20000; i++) { console.log(i); }
我感觉就是HB内置的终端在打包完强行关掉了所有进程，导致了有些异步的任务根本没法正确完成

更多关于uni-app H5打包时vite.config.js里插件的closeBundle代码无法正常运行的实战教程也可以访问 https://www.itying.com/category-93-b0.html


在使用 uni-app 打包 H5 项目时，如果你在 vite.config.js 中使用了 closeBundle 钩子，但发现它无法正常运行，可能是由于以下几个原因：

1. Vite 版本问题

closeBundle 是 Vite 2.x 及之后版本中引入的钩子。如果你使用的是 Vite 1.x 版本，那么这个钩子是不可用的。请确保你使用的是 Vite 2.x 或更高版本。

npm install vite[@latest](/user/latest)

2. 插件注册问题

确保你正确地在 vite.config.js 中注册了插件，并且 closeBundle 钩子被正确地定义。

import { defineConfig } from 'vite';
import uni from '[@dcloudio](/user/dcloudio)/vite-plugin-uni';

export default defineConfig({
  plugins: [
    uni(),
    {
      name: 'custom-close-bundle-plugin',
      closeBundle() {
        console.log('closeBundle hook is running');
        // 你的自定义逻辑
      },
    },
  ],
});

3. 打包流程问题

closeBundle 钩子是在打包结束后触发的。确保你的打包流程正确执行，没有提前终止或出错。

4. 异步问题

如果 closeBundle 钩子中有异步操作，确保你正确处理了异步代码。你可以使用 async/await 或者返回一个 Promise。

closeBundle: async () => {
  console.log('closeBundle hook is running');
  await someAsyncFunction();
  // 你的自定义逻辑
},

5. 日志输出问题

如果你在 closeBundle 钩子中使用了 console.log 或其他日志输出方式，确保你的构建工具或终端能够正确显示这些日志。你可以尝试使用 process.stdout.write 或其他日志库来输出日志，以确保日志能够被捕获。

6. 插件顺序问题

某些插件可能会影响 closeBundle 钩子的执行。尝试将你的插件放在插件数组的最后，以确保它在其他插件之后执行。

7. 检查构建环境

确保你在正确的环境中运行打包命令。closeBundle 钩子只在打包时触发，而不在开发服务器运行时触发。

npm run build:h5

8. 调试

如果你仍然无法解决问题，可以尝试在 closeBundle 钩子中添加更多的调试信息，或者使用 debugger 语句来逐步调试代码。

closeBundle() {
  debugger;
  console.log('closeBundle hook is running');
  // 你的自定义逻辑
},

9. 检查 uni-app 版本

uni-app 的版本也可能影响 vite.config.js 的配置。确保你使用的是支持 Vite 的 uni-app 版本。

npm install [@dcloudio](/user/dcloudio)/vite-plugin-uni[@latest](/user/latest)
回到顶部