devcontainer.jsonを下記の内容にすべて書き換え { "name": "React Native Android Container", // Sets the run context to one level up instead of the .devcontainer folder. "context": "..", // Update the 'dockerFile' property if you aren't using the standard 'Dockerfile' filename. "dockerFile": "Dockerfile", // The optional 'runArgs' property can be used to specify additional runtime arguments. "runArgs": [ "--privileged", // give all capabilities to a container, in other words, the container can then do almost everything that the host can do "--net", "host", // forwarding all host machine ports "-v", "/dev/bus/usb:/dev/bus/usb" // mount connected USB devices to a container ], "settings": { // This will ignore your local shell user setting for Linux since shells like zsh are typically // not in base container images. You can also update this to an specific shell to ensure VS Code // uses the right one for terminals and tasks. For example, /bin/bash (or /bin/ash for Alpine). "terminal.integrated.shell.linux": null }, // Add the IDs of extensions you want installed when the container is created in the array below. "extensions": ["msjsdiag.vscode-react-native"] }
Dockerfileを下記の内容にすべて書き換え FROM reactnativecommunity/react-native-android:latest RUN npm install -g expo-cli react-native-cli
コンテナをビルドして環境を移動
左下の「><WSL: Ubuntu」をクリック
Open Folder in Containerをクリック
新しいウインドウが開きContainerのビルドが始まる
初回は時間がかかる
エラーが出て失敗する場合は、再度左下の「><WSL: Ubuntu」をクリックし、Reopen in Containerをクリックしてみる(たまにこれで解決する)
ビルドが完了したら、VSCodeの拡張機能「Preview.js」をインストール
VSCodeのウインドウ左側のExtension(拡張機能)のアイコンをクリック
検索ボックスに「Preview.js」と入力し、下記のExtensionをインストールする
Adaloコンポーネントを作成
以降、前節でビルドしたContainerを参照しているVSCodeのウィンドウでの作業
左下が「>< Dev Container: React Native Android Cont…」となっていればOK
ディスカッション
コメント一覧
まだ、コメントがありません