Next.js×Puppeteerでビルドエラーになった話

プログラミング
スポンサーリンク

起こった問題

Next.js14でビルドをしようとしたときに、以下のようなエラーが出力されていました。
修正を入れてもいないのに、puppeteer周りでエラーが出力されていた。
エラー内容

> next build

Failed to compile.

./node_modules/puppeteer-core/lib/esm/puppeteer/cdp/EmulationManager.js
Module parse failed: Unexpected token (174:32)
File was processed with these loaders:
 * ./node_modules/next/dist/build/webpack/loaders/next-flight-loader/index.js
 * ./node_modules/next/dist/build/webpack/loaders/next-swc-loader.js
You may need an additional loader to handle the result of these loaders.
|                 private: true,
|                 access: {
>                     has: (obj)=>#applyViewport in obj,
|                     get: (obj)=>obj.#applyViewport
|                 },

Import trace for requested module:
./node_modules/puppeteer-core/lib/esm/puppeteer/cdp/EmulationManager.js
./node_modules/puppeteer-core/lib/esm/puppeteer/puppeteer-core.js
./src/app/puppeteer/route.ts

解決方法

先に具体的な問題箇所と解決方法を書きます。

問題になってたのは以下のようなコードでした。

export class ConfigUtil {
    public static getApiPath = () => {
        return process.env.XXX;
    }
}


// 別ファイル
...
    fetch(ConfigUtil.getApiPath(), ...);
...

どうも、ConfigUtilをSSRとCSRの両方で実行していたことが原因のようでした。
ただ、なぜこれでpuppeteer-coreのビルドエラーが出るのかはなぞでした。
※ ご存じの方がいたら教えてください…

コメント

タイトルとURLをコピーしました