Skip to main content

Docusaurus Node/SSR ビルドでコケる

· 3 min read
hand-dot(Kyohei Fukuda)

下記のエラーが発生してちょいと困った

[ERROR] Docusaurus Node/SSR could not render static page with path /template-design because of following error:
ReferenceError: atob is not defined

解決方法としては docusaurus.config.js にてwebpack追加設定用のプラグインを追加。

    function myPlugin() {
      return {
        name: 'custom-docusaurus-plugin',
        configureWebpack() {
          const newConfig = {
            plugins: [
              new webpack.ProvidePlugin({
                Buffer: ['buffer', 'Buffer'],
                process: 'process/browser',
                atob: 'atob',
              }),
            ],
          };
          return newConfig;
        },
      };
    },

こんな感じ。webpackのProvidePluginで atob を追加する。 あとは npm i --save-dev atob でatobを追加する。 もろもろ無いですと言われるものはwebpackのProvidePluginを通して提供するようにすれば良いということがわかった。

とりあえずこれでビルドができるようになった。めでたしx2

日記​

今日は朝はAmazonでもろもろ欲しかったものを買って、下北沢まで妻と娘と散歩。結構いい運動になるし、今日は天気がいいので楽しかった。そのあとはスタバで作業。

作業記録ログ​

labelmake.jp の依存の更新をした。ビルドでコケるので対応が必要。

エラーログから下記のissueに解決策がありそう https://github.com/ethers-io/ethers.js/issues/998

Node-fetchが問題か https://github.com/node-fetch/node-fetch

npm run functions:build

で再現できるので修正していく。 上記のコマンドは netlify-lambda のビルドのスクリプト。

node-fetchのレポジトリにissueがあった Issue with Serverless and/or webpack #1414 さらに上記のissue内に Cannot find module 'node:http` on AWS Lambda v14 #1367 というissueがあった。

大体原因がわかってきた。netlify-lambdaは AWS Lambdaに依存しているのでそれが動かないからnetlify-lambda のビルドで落ちるということっぽい。 一旦依存を"node-fetch": "^2.6.7" にすればビルドはできることがわかったので一旦これでビルドしてタスクを先に進める、

本日の作業​

  • playgroudのREADMEを編集する
  • サイトやREADMEにnpmへのアクセスを追加 #1524
  • pdfme/websiteビルドして公開
  • labelmake.jpのissueとprojectを整理
  • 8面テンプレートの管理ミス
  • labelmakeのイシュー対応

明日の作業​

  • 8面テンプレートの管理ミス
  • labelmakeのイシュー対応