web-dev-qa-db-ja.com

create-react-appビルドをLAMP / XAMPP / WAMPにデプロイします

Apache WAMP/XAMPPサーバーにビルドをデプロイする方法は？

create-react-appで作成されたアプリがあり、このアプリケーションに2つのページがあります

yarn startまたはnpm startを実行すると、正常に機能し、URLナビゲーションまたはボタンクリックですべてのページが正しくレンダリングされます。

ビルドコマンドを実行しました

npm run build

staticフォルダーにすべてのbuildファイルとindex.htmlファイルを生成しています。

このビルドフォルダーのコンテンツをwwwフォルダーのwampに移動し、ホームページのみを表示するURL http://localhostで実行します。次のページは404 not found errorを示しています

しかし、npmコマンドのserveモジュールを実行しているときは、http://localhost:5000で正常に動作しています。

ビルドを提供

これを解決する方法を教えてください

アプリケーションをWAMPサーバーにデプロイする必要があります。すべて静的ページであり、残りのAPIコンテンツはありません。

apachereactjsreact-routercreate-react-appyarnpkg
8
Sundar

デフォルトでは、reactプロジェクトは、サーバーの「www」（ルート）フォルダーに直接デプロイされるように構築されています。したがって、プロジェクトの「build」フォルダーの内容をWAMPの「www」フォルダーにコピーしてから、ブラウザーで http：// localhost / に移動できます。プロジェクトが表示されます。

または、WAMPルートサブフォルダーを使用することもできます。 「www/react /」。この場合、package.jsonファイルにhomepageキーを追加します。

"homepage": "http://localhost/react/",

次に、プロジェクトを再度ビルドします。

npm run build

最後に、プロジェクトの「build」フォルダーの内容を「www/react /」にコピーします。プロジェクトを表示するには、 http：// localhost/react / にアクセスしてください。

詳細については、 Apache WebサーバーにReactアプリをデプロイする方法

4
vess

ビルド用にホームページを構成する必要があります。

0
EltraEden

にbasename属性を設定します。

<Router basename={'/directory-name'}>
    <Route path='/' component={Home} />
</Router>

directory-nameは、xampphtdocsフォルダーの下のフォルダー名です。

0
Miraj Khandaker