web-dev-qa-db-ja.com

create-react-appをWebホストに展開する方法（例：Siteground）

Create-react-appを使用してreactプロジェクトを構築しており、Sitegroundのホスティングサーバーにコードをデプロイする方法を見つけようとしています。

誰でもこれを行う最良の方法を知っていますか？ FTP経由でビルドフォルダーをインポートしますか？ GitHubを使用してプロセスを自動化できますか？

前もって感謝します！

reactjsgithubweb-deploymentcontinuous-deploymentcreate-react-app
10
Dane W. Iliff

create-react-app docs、実行するnpm run buildそして基本的には、出力を取得してWebサーバーにFTPで送信します。

しかし、あなたの質問は非常に広範です-GitHubまたは他のツールを使用して自動化できますが、それは実際にStackOverflow（そのような種類の質問には適切なフォーラムではありません）に関する意見のある回答を求めています。

6
arthurakay

npm run buildまたはyarn build

本番用のアプリをbuild folderにビルドします。プロダクションモードでReactを正しくバンドルし、最高のパフォーマンスを得るためにビルドを最適化します。

npm run buildは、アプリの本番ビルドでビルドディレクトリを作成します。サイトへの訪問者にindex.htmlが提供され、/static/js/main.<hash>.jsなどの静的パスへのリクエストが/static/js/main.<hash>.jsファイルのコンテンツとともに提供されるように、お気に入りのHTTPサーバーを設定します。

ソース： create-react-app

3
salman.zare

FileZillaを使用してcreate-react-appをsitegroundにアップロードしたのは、次のとおりです。

  1. すべてのプロダクションの準備ができたらnpm run build
  2. ブラウザでsiteGroundを開き、myAcountセクションにgo to cPanelをクリックして下にスクロールし、FTP Accountsを見つけます
  3. ディレクトリpublic_htmlを指す新しいアカウントを作成します
  4. 作成されると、下に表示され、configure FTP clientを右クリックして、手動設定で接続する必要があるものが表示されます。
  5. fileZillaを開き、ファイルでsiteManagerに移動してからnew siteに移動します
  6. Host（filezillaで）=== FTP server（sitiGroundで）、portをサイトグラウンドポート、プロトコル、暗号化として設定し、デフォルトのままにします。
  7. Logon Typeを通常に設定、user === FTP user（siteGround）およびpasswordはそのFTPユーザーの作成に使用したもの
  8. connectをクリックして、yourApp/build（PCの左側から）のcontentを（フォルダーに貼り付けます右側）であるpublic_html in siteGround

それでおしまい！あなたのウェブサイトに行って確認してください、反応アプリがそこに表示されるはずです

ここにこの手順のソースがあります https://www.siteground.com/tutorials/ftp/ ここではfileZillaのクイック接続を使用していますが、複数のサイトがあるため、siteManagerクリーンで、次回のために資格情報を保存します

2
RamiroIsBack

通常、ホストベンダーのガイド付き戦略があります。

例：

Heroku Create React App Build

S3 Cloudfront

それ以外の場合は、自分で管理し、次の機能を持つカスタムビルドスクリプトを登録する必要があります。

npm run build

そして、ビルドフォルダーを移動します。 Mavenを使用している場合、次のようなプラグインでビルド全体を管理できます。

フロントエンドMavenプラグイン

2
Black.Jack