はじめに

Vue + Cordova の iOS アプリを Xcode v11 でビルドすると Cannot read property 'toLowerCase' of undefined のエラーが出たので、解決方法について整理した。

TL;DR

  • Xcode v11 と cordova-ios v4 系は互換性がない
    • vue add cordova でインストールされるのは cordova-ios v4.5.5 (2019/11/21 現在)
  • cordova platform rm ios → cordova platform add ios@latest で解決
この記事が参考になった方
ここかここからチャージや購入してくれると嬉しいです(ブログ主へのプレゼントではなく、ご自身へのチャージ)
欲しいもの / Wish list

目次

  1. はじめに
  2. TL;DR
  3. 環境・条件
  4. 詳細
    1. エラーについて
    2. 解決方法
  5. まとめ
  6. その他・メモ
  7. 参考文献

環境・条件

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
$ sw_vers
ProductName:	Mac OS X
ProductVersion:	10.15.1
BuildVersion:	19B88

$ node -v
v12.7.0

$ npm -v
6.10.3

$ vue -V
3.10.0

$ cordova -v
8.1.2 (cordova-lib@8.1.1)

詳細

エラーについて

vue create → vue add cordova で iOS 環境を作成し、ビルドを行ったところ Cannot read property 'toLowerCase' of undefined というエラーが出る。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
$ vue create test-app
...
🎉  Successfully created project test-app.
...

$ cd test-app/
$ vue add cordova
...
? Name of folder where cordova should be installed src-cordova
? ID of the app com.vue.example.app
? Name of the app VueExampleAppName
? Select Platforms: iOS
...

$ npm run cordova-build-ios
...
Cannot read property 'toLowerCase' of undefined
# ↑

調べたところ、Xcode v11 系と cordova-ios v4 系に互換性が無いとのこと。

Cordova iOS v4.5.x is not compatible with Xcode 11. You’ll need to update to Cordova iOS 5.x.
Xcode 11 issue while building cordova app with ios platform v4.5.5 · Issue #692 · apache/cordova-ios より

2019/11/21 現時点では、vue add cordova で iOS を選択してインストールされるのは cordova-ios v4.5.5 な模様。

解決方法

src-cordova でプラットフォームの削除→追加を行えば OK。
※環境によってはディレクトリが src-cordova ではないかも、適宜読み替え。

1
2
3
4
5
6
7
8
9
10
11
$ cd src-cordova

$ cordova platform rm ios
Removing platform ios from config.xml file...
Removing ios from cordova.platforms array in package.json

$ cordova platform add ios@latest
Using cordova-fetch for cordova-ios@latest
Adding ios project...
...
Saving ios@latest into config.xml file ...

これでビルドが通るようになる。

1
2
3
4
5
6
7
$ cd ..
$ npm run cordova-build-ios
 INFO  executing "cordova build ios --release" in folder /Users/hoge/test-app/src-cordova
No simulator found for ". Falling back to the default target.
Building for "iPhone 11 Pro Max" Simulator (com.apple.CoreSimulator.SimDeviceType.iPhone-11-Pro-Max, iPhone-11-Pro-Max)."
...
** BUILD SUCCEEDED **

まとめ

  • Xcode v11 と cordova-ios v4 系は互換性がない
    • vue add cordova でインストールされるのは cordova-ios v4.5.5 (2019/11/21 現在)
  • cordova platform rm ios → cordova platform add ios@latest で解決

その他・メモ

最初 npm i cordova-ios@"^5.0.0" とだけしてエラー解決せずにハマった。

参考文献

関連記事

この記事が参考になった方
ここかここからチャージや購入してくれると嬉しいです(ブログ主へのプレゼントではなく、ご自身へのチャージ)
欲しいもの / Wish list