web-dev-qa-db-ja.com

サブディレクトリからアプリを提供するようにcreate-react-appを構成するにはどうすればよいですか？

サーバーにレンダリングされたクラシックWebアプリケーションがあります。 Reactで単一ページアプリケーションとして管理パネルを作成したい。 https://smyapp.example.com/admin/ から管理パネルを提供したい。 create-react-appを使用しようとしましたが、ルートURLからSPAを提供すると想定しています。 create-react-appサブディレクトリからアプリを提供するように"admin"を構成するにはどうすればよいですか？ドキュメントで"homepage"プロパティを見つけましたが、適切に理解するには完全なURLが必要です。アプリがいくつかの環境にデプロイされているため、完全なURLを提供できません。

reactjswebpacksingle-page-applicationcreate-react-app
12
guest

これには、package.jsonにエントリを追加する必要があります。

キー「ホームページ」を追加します：yourpackage.jsonの「your-subfolder /」すべての静的ファイルは「your-subfolder」からロードされます

サブフォルダーがなく、同じフォルダーからロードする必要がある場合は、パスを「./」として追加する必要があります

"homepage": "./"

ここ から

6
kiranvj

Create-react-app v2およびreact-router v4の場合、次のコンボを使用して、 "/ app"の下に本番（ステージング、uatなど）アプリを提供しました。

package.json：

"homepage": "/app"

次に、アプリのエントリポイントで：

 <BrowserRouter basename={process.env.PUBLIC_URL}>
  {/* other components */}
 </BrowserRouter>

そして、すべてがローカル開発環境とデプロイされた環境の両方で「機能する」だけです。 HTH！

5
Greg Haygood

おそらくreact-routerとそのrelativebasenameパラメーターを使用すると、サブディレクトリからアプリを提供できます。

basenameは、すべての場所のベースURLです。サーバー上のサブディレクトリからアプリを提供する場合、これをサブディレクトリに設定することをお勧めします。適切にフォーマットされたベース名には、先行スラッシュが必要ですが、後続スラッシュは含まれません。

例えば ​​：

<BrowserRouter basename="/calendar"/>

そう <Link to="/today"/>はレンダリングします<a href="/calendar/today">

参照： https://reacttraining.com/react-router/web/api/BrowserRouter/basename-string

ごきげんよう！

1
tmaz

package.jsonに次のようなものを入れます。

"homepage"： " http：// localhost：3000/subfolder "、

パブリックサーバーまたはローカルサーバーで正常に動作します。もちろん、サブフォルダーはフォルダーでなければなりません。

0
ristepan