7
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

ElixirDesktop iOSを動かす

Last updated at Posted at 2022-07-28

はじめに

本記事はElixirDesktopiOS Exampleを以下の記事で実際にやってみた備忘録になります

環境

CPU M1
OS masOS Monterey 12.4
XCode 13.4.1
elixir asdf elixir 1.13.0-otp-25
elrang asdf erlang 25.0.3

下準備

asdfは無効化するのでhomebrewのelixir
erlangのバージョンマネージャー kerl
swiftのパッケージマネージャーの carthage
asdfをディレクトリ毎に無効化設定をする direnv
をそれぞれインストールします

brew install elixir kerl carthage direnv

ElixirDesktop用にカスタムしたerlangをインストールします
ビルドスクリプトで ~/projects/を参照するのでこの通りにしておきましょう

mkdir -p ~/projects/
kerl build git https://github.com/diodechain/otp.git diode/beta 24.beta
kerl install 24.beta ~/projects/24.beta

プロジェクトセットアップ

cloneしてきます

git clone https://github.com/elixir-desktop/ios-example-app.git

プロジェクトに移動してライブラリのインストールを行います

cd ios-example-app && carthage update --use-xcframeworks

asdfだとうまくビルドができないため無効化してシステムのElixirを使うようにします

touch .envrc

userは適宜自分のユーザー名に変えてください

.envrc
PATH_rm /Users/user/.asdf/shims
PATH_rm /Users/user/.asdf/bin

設定を書いたら有効化します

direnv allow

これでasdfが無効化されました

完了したらプロジェクトをXCodeで開きます

open todoapp.xcodeproj

ビルド開始

とりあえず実行します
まぁ失敗するので色々直していきます

プロジェクトの設定

Gneral tabでbundle identifierを適当に変えます今回はexmaple3としてます

スクリーンショット 2022-07-28 23.19.24.png

各種ライブラリが埋め込まれていないので Embed & Sign に変更します

スクリーンショット 2022-07-28 23.20.38.png

Signning & Capabilities tabのteamを自分のものに変更します

スクリーンショット 2022-07-28 23.21.41.png

Build Settings tabで 表示をbasicからallに変更して Enable Bitcodeをnoにします

スクリーンショット 2022-07-28 23.24.05.png

うまくOSを判別してくれないようなので、環境変数のセットします

スクリーンショット 2022-07-28 23.36.54.png

edit schemeでArgumentsタブを選択肢環境変数に ELIXIR_DESKTOP_OS に ios をセットします

スクリーンショット 2022-07-28 23.37.49.png

Elixirのライブラリアップデート

Elixirのコードがelixir-appという名前でgit cloneされているのでそちらに移動します

cd elixir-app

wxとdart-sassを最新にします

elixir-app/mix.exs
defmodule Todo.MixProject do
  use Mix.Project

  # Run "mix help deps" to learn about dependencies.
  defp deps do
    [
      {:ecto_sqlite3, "~> 0.7"},
      # {:desktop, path: "../desktop"},
      {:desktop, github: "elixir-desktop/desktop", tag: "v1.4.0"},
      {:wx, "~> 1.0.10", hex: :bridge, targets: [:android, :ios]}, # 追加
      # Phoenix
      {:phoenix, "~> 1.6"},
      {:phoenix_live_view, "~> 0.16"},
      {:phoenix_html, "~> 3.0"},
      {:phoenix_live_reload, "~> 1.3", only: [:dev]},
      {:gettext, "~> 0.18"},
      {:plug_cowboy, "~> 2.5"},
      {:jason, "~> 1.2"},

      # Assets
      {:esbuild, "~> 0.2", runtime: Mix.env() == :dev},
      {:dart_sass, "~> 0.5", runtime: Mix.env() == :dev}, # 0.5に変更

      # Credo
      {:credo, "~> 1.5", only: [:dev, :test], runtime: false}
    ]
  end
end

リンクが切れていないsassのバージョンを設定します

elixir-app/config/config.exs
config :dart_sass,
  version: "1.49.11", # 1.49.11に上げる
  default: [
    args: ~w(css/app.scss ../priv/static/assets/app.css),
    cd: Path.expand("../assets", __DIR__)
  ]

完了したら mix deps.getを行い上に戻ります

mix deps.get
cd ..

再度ビルドを行い・・・

無事動きました!

89c748bf746d39335ee0c7c7b55ed986.gif

実機でエラー

実機で実行しようとするとsqliteのファイルが作成されずエラーになったので原因を探ったところ
swift側でアプリのhomeの場所は以下にセットされているのですが

/var/mobile/Containers/Data/Application/48C9C67D-400B-466B-B1C6-44695A00771F/Library/io.elixirdesktop.example

実際にファイルを作ろうとしたのは

/private/var/mobile/Containers/Data/Application/48C9C67D-400B-466B-B1C6-44695A00771F/.config/todo

とずれていたのが原因でした

対応するにはbundle identifierが固定値になっているので関数で取得するようにします

todoapp/Bridge.swift
// line 41
home = FileManager.default.urls(for: .libraryDirectory, in: .userDomainMask)[0].appendingPathComponent(Bundle.main.bundleIdentifier!)

それでも解決しなかったのでElixir側でパスを指定します
xcodeで指定したidentifilerとLibraryを追加します
ですがこれだとシミュレーターで動かないのでもとの方は残しておきましょう
環境変数とかで分けれるといいですね

elixir-app/lib/todo_app.ex
  def config_dir() do
    # Path.join([Desktop.OS.home(), ".config", "todo"])
    Path.join([Desktop.OS.home(), "Library", "io.elixirdesktop.example3", ".config", "todo"])
  end

これで再度ビルドを実行して無事実機でも動きました!

最後に

これでAndroidとiOS両方のサンプルが動くようになりました
あとはDB周りがまだ使い勝手が良くないので色々検証してみたいと思います
本記事は以上になりますありがとうございました

参考

https://qiita.com/RyoWakabayashi/items/f5d97a7e857983eac7a4
https://github.com/elixir-desktop/ios-example-app
https://typememo.jp/tech/chromium-build-macos-should-be-disable-asdf/

7
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
7
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?