新型MacBookAir M1チップ(Apple Silicon)でRails開発環境を構築する

投稿者: | 2020年12月6日

この記事は GMOアドマーケティング Advent Calendar 2020 6日目の記事です。

はじめに

GMOアドマーケティングの吉岡です。

今回は2020-11-17発売の新型MacBookAirでRails開発環境を構築したので、その手順を共有したいと思います。
この記事は2020-11-30に執筆したもので、対応アプリが増えるにつれて環境構築手順も簡単になっていくと思いますが、今動かしたい人のための記事となっています。

CPUについて

これまで、AppleのPCはインテルやAMDのCPUが使われていましたが、今回は独自開発のM1チップが使われ、8コアTDP10wを実現しており、かなりの高性能となっています。
しかしながら、既存のアプリはintel/AMDのCPU用に作られているものが多く、M1チップに対応していないアプリはほぼ動作しません。
これでは流石に厳しいので、AppleからRosetta2というIntelのチップセット向けにコンパイルされたアプリの実行をエミュレートする環境が準備されています。
とはいえ、ネイティブ対応しているものと比べると遅いので、今回はこちらを使わずに対応していきたいと思います。

開発環境

Visual Studio CodeはApple Silicon用バイナリに対応しているので、こちらのエディタを使います。
https://code.visualstudio.com/insiders/#
赤丸で囲ったARM64 ExperimentalをクリックするとApple Silicon用バイナリがダウンロードできます。

MacPortsインストール

パッケージ管理にはMacPortsを使っていきます。
理由としては、現状、MacPortsのみで取得できるarm64バイナリが存在することと、homebrewでは現在arm64とx86_64のバイナリが混在しており、将来的に移行に苦労する可能性があるためです。
homebrew環境がある程度整備されてから移行したいです。

arm64版のRubyとnodejsをインストールするために必要なパッケージをMacPortsで追加します。
基本的にはこちらのQuickstartを参考にインストールします。
https://www.macports.org/install.php

  1. Xcodeインストール
    Appストアからインストール
  2. コマンドラインツール・ライセンス確認

  3. MacPortsパッケージインストール
    リンク先の[macOS Big Sur v11]用MacPortsパッケージをダウンロードしてインストール
  4. ~/.zshrcに追記

  5. 動作確認

Rubyインストール

初期状態ではRuby2.6.2がインストールされていますが、最新のRubyを使いたいため、rbenvを使ってインストールします。
今回はbrewを使わないため、GitHubからインストールします。

https://github.com/rbenv/rbenv

opensslとreadlineをインストールして、build用のオプションを設定します。

Rubyをインストールします。

動作確認

Railsインストール

Railsのサンプルアプリを作成します。
DBですが、MySQL、MariaDBの対応が進んでいないため、今回はsqlite3を使います。
現状では開発環境はsqlite3、本番ではMySQL、MariaDBなどで対応していくと良さそうです。

Rails用フォルダ作成

rails/Gemfileを開き、#gem “rails”のコメントを外してbundle install

railsフォルダにRailsをインストール後、そのRailsを使ってsample_appを作成

開発のみsqlite3を使う場合はsample_app/Gemfileを以下のように変更します。

MacPortsからsqlite3をインストール

productionを除いてbundle install

DBを作成し、Rails起動

TypeError: unable to resolve type ‘size_t’

sassで使われているffiが対応していないためエラーになってしまうようです。
ffi公式へのPull requestレビュー中ブランチで解消できてそうなのでこちらを使いたいのですが、直接指定しても動作しないため、ffiリポジトリをForkして以下の変更をマージしたブランチを使います。
https://github.com/ffi/ffi/compare/master…Watson1978:fix-crash-on-apple-silicon

Gemfileに以下追記。公式が対応したら不要。

再度railsコマンドを実行します。

Railsの問題は解消しましたが、このまま起動すると今度はwebpacker関連のエラーが出るため、次はこちらに対応していきます。

Webpacker configuration file not found

Webpack対応

まずはwebpackerをインストールしてみます。

次のような警告が表示されます。nodejsをインストールする必要がありそうです。

sh: node: command not found
sh: nodejs: command not found
Node.js not installed. Please download and install Node.js https://nodejs.org/en/download/

MacPortsからnodejsをインストールしてもうまくいかないため、nvmをインストールします。
nvmとはnodejsのバージョン管理ツールです。
nvmにnodejs version15をインストールし、npmでyarnをインストールします。

詳細はこちら
https://github.com/nvm-sh/nvm

install.shでzshrcにnvmの設定が追加されます。

yarnをインストールします。

yarnコマンドが使えるようになったらwebpackerをインストールしてRailsを起動します。
localhost:3000にアクセスして画面を確認。

無事画面が表示できました。ちゃんとarm64で動作しているようです。

まとめ

アプリの対応が完全ではなく、いろいろはまりどころは多いですが、無事動作させることができました。
新型MacBookAirを使ってみた感想ですが、高性能でバッテリー持ちも良いので、アプリ側の対応が進むと一気に置き換えが進んでくるのではないでしょうか。
現状、初心者に厳しい状況ではありますが、開発環境を整える上で勉強になることも多く、整えてしまえば高性能マシンでの開発が可能になるので、この機会に一新するのも良いかもしれません。

以上、新型MacBookAirでRails開発環境を構築した話でした。
明日は、KONCEさんによる「PHPとYouTube Data APIで急上昇ランクを取ってみる」です。
引き続き、GMOアドマーケティング Advent Calendar 2020 をお楽しみください!