😵

CodeBuildでVue3のプロジェクトのビルドに失敗する

2023/06/01に公開

AWS

CodeBuildでVue.jsプロジェクトが謎のビルドエラーにより、デプロイできずにハマったのでその解決方法の共有をします。
直接エラーメッセージとかでググっても解決方法が出てこなくて困った…。

バージョン

Vue.js:3系
node:開発環境はv18.12.1

現象

とある開発でとあるライブラリを利用することになりました。
開発環境で件のライブラリを追加してのビルド(vue-cli-service serve、vue-cli-service build)は問題なくいっており、そのまま開発を進めていました。

問題は開発環境でのテストも終わりAWS環境にデプロイしようとCodeBuildを走らせたときに発生しました。
以下のエラーが発生し、npm run build(vue-cli-service build)がエラー停止したのです。

 ERROR SyntaxError: Unexpected token '('
 .../node_modules/@vue/compiler-sfc/dist/compiler-sfc.cjs.js:16397
     #fillNegs() {

対策

ググってもめぼしい情報はありませんでした。
そのため、ChatGPT(無料プラン)に聞いてみたところnodeのバージョン違いが原因じゃないか?ということだったので、
CodeBuildのnodeバージョンを調べてみると(使用しているイメージにもよりますが)10系か12系が使われているようでした。

そこでbuildspec.ymlにnode -vとn 18.12.1を指定してビルド時のnodeバージョンを上げるようにします。

～省略～
phases:
  install:
    runtime-version:
      nodejs: 12
    commands:
      - node -v
      - n 18.12.1
      - node -v
      - npm install
～省略～

ここでn <バージョン>はCodeBuildのビルド環境にインストールされているnodeのバージョンマネージャーで、ビルド時に指定したバージョンのnodeをインストールしてくれるものです。

これで実行してみると別のエラーでビルドが停止しました。

node /lib64/libm.so.6: version `GLIBC_2.27' not found (required by /usr/local/bin/node)
node /lib64/libc.so.6: version `GLIBC_2.28' not found (required by /usr/local/bin/node)

停止したのはnコマンド実行後のnode -vで、その前のnode -vはv12.22.2というバージョンを返してきていることから18系を動かすにはインストールされている環境が古すぎるようです。

そこでn 18.12.1としていた部分をn 16.20.0にしてひとつバージョンを下げます。
この16.20.0はひとつ前のLTSバージョンを指定しました。

これでビルドが通りました!
やったね!

原因

ビルドエラーになっていたのは今回追加したライブラリとは無関係そうなライブラリですが、どうやら件のライブラリのインストール時に依存関係にあるライブラリもバージョンアップされたため、古いnode環境(12系)ではビルドできなくなっていました。
ですが、開発環境は新しいバージョン(18系)だったため、問題なくビルドできていたようです。

まとめ

原因に気づけたのはChatGPTの助言があったからですが、直接原因を言い当てたというよりは「定型文にバージョンを確認してください的なメッセージがあったから他に当てもないし騙されたと思ってやってみるか」程度でしたが、ググっても出てこない情報や、客観的な意見(環境に慣れていると視野狭窄により気づかない観点からの意見)としてはChatGPTも役立つなと思いました。

機密情報などを流さない(そもそも設定で学習への利用と履歴は切っているがそれにしても)のは当然ですが、ChatGPTは便利ですね。
今回の件で言えば既にエラーメッセージでググっているのでChatGPTにエラーメッセージを入力しても特に問題はないとの判断です。
またChatGPTには「(エラーメッセージを開示してから)このビルドエラーの原因はわかりますか?」とか「開発環境ではビルドに成功していてCodeBuild上だけエラーになります」とか聞いてました。
その他、プロジェクト固有の情報は入力していません。
どの返答にも大体nodeのバージョンなどの環境を確認してくださいだったので、ドンピシャな情報があったというよりは定型文な解答だったように感じました。

バージョン

現象

対策

原因

まとめ

Discussion