NextJS 13中Puppeteer重装后报错：TypeError: oe is not a function

从报错栈可以看出，问题源于@puppeteer/browsers依赖的yargs模块在webpack打包时出现异常，属于依赖版本冲突或NextJS打包兼容性问题，按以下步骤修复：

1. 移除手动安装的yargs依赖
   项目中手动安装了yargs@17.7.1，但Puppeteer内部依赖的yargs版本与它冲突，先卸载：

   npm uninstall yargs
   

2. 彻底清理并重装依赖

   rm -rf node_modules package-lock.json .next
   npm cache clean --force
   npm install
   

3. 配置NextJS跳过Puppeteer相关依赖打包
   在项目根目录创建或修改next.config.js，添加webpack外部依赖配置，让服务端代码直接使用Node环境的模块，避免webpack打包异常：

   /** @type {import('next').NextConfig} */
   const nextConfig = {
     webpack: (config, { isServer }) => {
       if (isServer) {
         config.externals.push('puppeteer', '@puppeteer/browsers', 'yargs');
       }
       return config;
     },
   };
   
   module.exports = nextConfig;
   

4. 调整Puppeteer启动配置
   Puppeteer 19+推荐使用新的无头模式，同时添加参数解决部分环境下的权限问题：

   const browser = await puppeteer.launch({
     headless: 'new',
     defaultViewport: null,
     args: ['--no-sandbox', '--disable-setuid-sandbox']
   });
   

5. 重启开发服务

   npm run dev
   

内容的提问来源于stack exchange，提问作者Sebastian