コンテンツにスキップ

GitHub・.zip・Lovable から既存のアプリをインポートする

要点「プロジェクト」ページで「インポート」を開き、GitHub、.zip、Lovable のどれかを選びます。MonstarX が数秒でコードを確認し、そのまま動くかどうかをお知らせします。「インポートして実行」を押すとアプリがプレビューで開き、チャット、編集モード、バージョン、QA がすべてあなたのコードのまま使えます。MonstarX で動かせないアプリ(スマホアプリ、Django、Rails など)は、代わりに読み込んで作り直せます。

開発者が作ったアプリ、別の AI ビルダーからエクスポートしたアプリ、GitHub のリポジトリにあるアプリなど、すでにアプリがあるならインポートしましょう。MonstarX がまず中身を確認し、動かせるかどうかを数秒でお知らせします。その後はプレビューでそのまま動き、MonstarX が作ったアプリと同じように、チャットで改良を続けられます。

アプリはどうやってインポートしますか?

Section titled “アプリはどうやってインポートしますか?”

プロジェクト ページのプロンプト欄で インポート を開き、コードのある場所を選びます。

  1. インポート → GitHub を選びます。

  2. リポジトリのアドレス(github.com/acme/shop、または acme/shop だけでも可)を貼り付け、確認 を押します。GitHub アカウントを接続していれば、非公開のものも含めてあなたのリポジトリが一覧になり、そこから選べます。

  3. 確認結果を読みます。別の ブランチ や、アプリがフォルダの中にある場合は別の フォルダ を選ぶと、もう一度確認されます。

  4. インポートして実行 を押します。

公開リポジトリなら、アドレスだけでインポートできます。非公開のリポジトリは、先にプロジェクトの GitHub メニューから GitHub を接続してください。詳しくは GitHub をご覧ください。

確認結果にはどんな意味がありますか?

Section titled “確認結果にはどんな意味がありますか?”
バッジ見出し意味
そのまま動きます「このまま MonstarX で動きます」Vite のアプリ(または MonstarX からエクスポートしたアプリが戻ってきたもの)。MonstarX で動かし、編集し、公開できます。
そのまま動きます · 公開は今のホスティング先「MonstarX で動きます(公開は今のホスティング先から)」独自のサーバーを持つアプリ(Next.js、Remix、Astro、Nuxt、SvelteKit、Create React App)。ここで動かして編集できます。公開は 公開 → Vercel から行うか、変更を GitHub に保存して今のホスティング先を使い続けます。
ここでは動かせません「MonstarX ではこのままでは動かせません — 作り直すことはできます」スマホアプリやデスクトップアプリ、シンプルな HTML サイト、Django、Rails、Laravel、Go などで作られたサイト。MonstarX が読み込んで、Web アプリとして作り直せます。
まだインポートできませんたとえば「アプリではなくライブラリです」や「大きすぎてインポートできません」MonstarX が動かすことも作り直すこともできないもの。理由と、どうすれば結果が変わるかが書かれています(多くの場合、アプリが入っているフォルダをインポートします)。

どの確認結果にも、アプリの使用技術、サイズ、そしてサンプルの環境ファイルに書かれたキー(VITE_MAPBOX_TOKEN のような設定値)の名前が表示されます。値は表示されません。インポートを止めるほどではない注意点は、黄色で表示されます。コミットされた .env ファイル(コピーはされず、キーは バックエンド → シークレット に入れます)、Docker Compose で起動するサービス、独自の API サーバー、Git LFS で管理されたファイル、10 MB を超えて取り込まれないファイルなどです。

インポートした後はどうなりますか?

Section titled “インポートした後はどうなりますか?”

ワークスペースが開き、取り込んだ内容を説明するカードが表示され、アプリがプレビューで起動します(初回の起動ではパッケージをインストールするため、1〜2分かかります)。

キー には、コードが読み込む設定値が、本当に必要かどうかで分けて並びます。必須(それを読み込む部分は値がないと動作しません)、任意(コードに代わりの値が用意されています)、未使用 です。値を貼り付けて 追加 を押すか、プロジェクトのサンプルファイルに値が書かれていれば 「…」を使う を押すと、その値でプレビューが再起動します。値は暗号化されて バックエンド → シークレット に保存されます。

値がまったくわからない場合は、値がわからない場合は、プロジェクトを作ったツールに聞く を押してください。プロジェクトを作ったツール(Lovable のプロジェクトなら Lovable のチャット)に貼り付けるメッセージが表示されます。コードを一切変えずに、すべてのキーと、それをどこからコピーできるかを挙げてもらうためのメッセージです。

コードに直接書かれたキーを見つけた場合、カードにはその種類とファイル名が表示されます(値は表示されません)。Stripe のシークレットキーや OpenAI のキーなど、秘密にすべきものは一番上に警告として表示されます。

インポートした後は何が使えますか?

Section titled “インポートした後は何が使えますか?”
  • プレビュー、チャット、編集モード、バージョン、QA は、すべて今のコードのまま使えます。MonstarX はアプリ自身のコードと書き方に沿って作業し、アプリに必要なパッケージがあれば追加します。
  • 公開:Vite のアプリは、ほかのアプリと同じように MonstarX で公開できます。独自のサーバーを持つアプリは、今のホスティング先で公開します。公開 → Vercel から行うか、GitHub に保存してホスティング先に取り込んでもらいます。詳しくは ほかのホスティング先 をご覧ください。
  • エクスポート では、画像も含めてリポジトリをそのまま受け取れます。
  • MonstarX のデータベースとアカウント は追加されません。インポートしたアプリは、コードが使っているもの(Supabase、Firebase、独自の API)をそのまま使い続け、バックエンド → データベース にもそのことが表示されます。アプリに必要なキーは バックエンド → シークレット に入れます。

monstarx ブランチとは何ですか?

Section titled “monstarx ブランチとは何ですか?”

ご自身の GitHub アカウントを接続して GitHub からインポートし、そのリポジトリにプッシュする権限がある場合、プロジェクトはリポジトリと連携したままになります。MonstarX はインポートしたコミットの位置に monstarx というブランチを作り、変更をそこに保存します。デフォルトブランチが動くことはありません。変更をメインのブランチに入れたいときは、monstarx からプルリクエストを作成してください。プロジェクトの GitHub メニューに、GitHub の比較ページへのリンクがあります。GitHub でそのブランチにプッシュされた変更も、MonstarX に取り込まれます。詳しくは GitHub をご覧ください。

MonstarX でアプリを動かせないときは?

Section titled “MonstarX でアプリを動かせないときは?”

スマホアプリ(Expo、React Native、Flutter、Swift、Android)、デスクトップアプリ、Django、Rails、Laravel、Go のサイトの場合、確認結果に コードを読み込んで、作り直しのプランを立てる が表示されます。

MonstarX は新しいプロジェクトを作り、元のコードを横に(読み取り専用で)置いたまま読み込んで、再構築プラン を提案します。画面、データ、コードにあるルール、使っているサービスとそれぞれの扱い(維持、置き換え、移行なし)、移行しないもの、そのまま引き継ぐロジックです。違っている点を伝えるとプランが修正され、作成する を押すと作成が始まります。細部はいつでも元のコードを検索して確認できます。ここで動かせるアプリにも 代わりに MonstarX で作り直す があり、MonstarX のデータベース、アカウント、公開を使いたいときに選べます。

インポートできるアプリの大きさは?

Section titled “インポートできるアプリの大きさは?”
上限値
コード3,000ファイル、12 MB まで(1ファイル400 KB まで)
画像などのファイル100 MB まで(1ファイル10 MB まで)
.zip100 MB まで
作り直し1,500ファイル、コード5 MB まで

上限を超えた場合は、確認結果に、実際の数、上限、そして解決方法が表示されます。たいていは、アプリが入っているフォルダだけをインポートします。

インポートすると GitHub のリポジトリは変更されますか?

デフォルトブランチは変更されません。プッシュの権限があれば変更は monstarx ブランチに入り、権限がなければリポジトリは読み込まれるだけです。

モノレポをインポートできますか?

はい。MonstarX がアプリの入っているフォルダを見つけ、確認結果から別のフォルダを選ぶこともできます。

MonstarX からエクスポートしたアプリをインポートできますか?

はい。MonstarX のプロジェクトとしてすべて元どおりに戻ります(データベースは新しく空のものになり、元のアプリのデータは元の場所に残ります)。

インポートしたコードを動かしても安全ですか?

コードは専用の安全なクラウドのコンピューターで動き、パッケージはインストールスクリプトを無効にしてインストールされます。

ほかの人が書いたコードをインポートできますか?

利用する権利のあるコードだけにしてください。確認結果にはリポジトリのライセンスが表示されるか、記載がないことが示されます。