LoginSignup
2
0

More than 1 year has passed since last update.

【Ruby on Rails】bootstrap導入時のExecJS::ProgramError

Last updated at Posted at 2021-05-17

エラー概要

bootstrap4のgemをインストールし、rails sでサーバーを立ち上げてページを表示しようとしたところ、ExecJS::ProgramError , TypeError: cannot read property 'version' of undefined と表示されてしまいました。(2021/5/15)

以前の開発では問題なく導入できていましたが、今回突然できなくなったため、その原因を探してみました。
image.png

動作環境

  • rails 5.2.6
  • ruby 2.6.3
  • linux

エラーの原因

2021/5/14にリリースされたexecjs2.8.1が依存関係にあるautoprefixer-railsに対応していないことが可能性として高いです。


さらに詳しく

新規アプリ作成

新規アプリを作成すると、同時に80個程度最低限必要なgemがインストールされます。その一つにexecjsというgemがあり、最新版のものがインストールされます。

ターミナル
[~/] rails new sample_app
:
Fetching execjs 2.8.1
Installing execjs 2.8.1
:
  • execjs 2.8.1 (最新 2021/5/14リリース)
    • ver.2.8.0 (2021/5/10 リリース)

bootstrapの導入

gemfileに追記をし、インストールを行います。bootstrapはいくつかのgemと依存関係があり、そのうちの一つにautoprefixer-railsというgemと依存関係があります。bootstrapのインストール時に一緒にインストールされます。

Gemfile
:
gem 'bootstrap', '~> 4.5'
gem 'jquery-rails'
ターミナル
[~/sample_app] bundle install
:
Fetching autoprefixer-rails 10.2.4.0
Installing autoprefixer-rails 10.2.4.0
:
Fetching bootstrap 4.6.0
Installing bootstrap 4.6.0
:

autoprefixer-rails

bootstrapのインストール時に最新のバージョンがインストールされますが、このautoprefixer-railsはexecjsと依存関係を持っています。実際にgemの依存関係を確認すると、最新の状態であってもexecjs 2.8以上に対応していないことが分かります。ここがエラーの原因である可能性が高いです。

  • autoprefixer-rails 10.2.5 (最新 2021/5/11 リリース)

    • 依存性: execjs < 2.8 (バージョンが2.8未満で最新のもの)
  • autoprefixer-rails10.2.4 (2021/2/11 リリース)

    • 依存性: execjs > 0 (バージョンが0以上で最新のもの)

いずれのautoprefixer-railsのバージョンであっても、エラーは発生してしまいますが、現状としてすでにexecjs 2.8.1がインストールされてしまっているため、ver. 10.2.5をインストールすることができず、ver. 10.2.4をインストールしている形になります。


エラーの解消方法

ターミナル
[~/sample_app] bundle update autoprefixer-rails
:
Fetching execjs 2.7.0 (was 2.8.1)
Installing execjs 2.7.0 (was 2.8.1)
Fetching autoprefixer-rails 10.2.5.0 (was 10.2.4.0)
Installing autoprefixer-rails 10.2.5.0 (was 10.2.4.0)
:

autoprefixer-rails 10.2.5に更新することで、新たにexecjs 2.7がインストールされ、無事エラーを解消することができました。

参考資料

2
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
0