reactjs項目如何上傳到ftp？

Question

我是 React 新手，我做了 2 個分頁網站進行鍛煉，一切都在我的本地主機上運行良好。

但我對如何將項目上傳到我的 linux 服務器感到困惑。

我做了什么？ 我使用以下命令通過終端創建反應應用程序：

create-react-app react-demo-project

終端創建我的項目，在項目根目錄中我有node_modules目錄。

所以我有一些問題：

1- React 項目可以在 linux 主機上正常工作嗎？

2- 我需要將我所有的項目上傳到 ftp 嗎？ 因為 node_modules 目錄中有大約 20.000 個文件。

Answer 1

使用此命令構建您的應用程序：

npm run build

Build 文件夾已在您的項目目錄中創建，在瀏覽器中打開 index.html 並檢查輸出...

如果您看到一個空白頁面（在構建並打開 index.html 之后），您必須更改 index.html 中的主要 js 文件路徑：

默認為： src="/static/js/main.ddfa624a.js"更改為： src="./static/js/main.ddfa624a.js"

我改變了 js 路徑，這奏效了！

Answer 2

create-react-app 有一個命令可以將您的應用程序捆綁到准備部署狀態。

npm run build

此命令會將您的應用程序捆綁在/build文件夾中。 使用此文件夾的內容，您可以在任何托管環境中部署您的應用程序。 使用此命令時，您無需手動安裝包和庫。 有關使用此命令和在不同托管環境中部署應用程序的更多信息，請參見create-react-app README

部署

npm run build使用應用程序的生產npm run build創建一個build目錄。 設置您最喜歡的 HTTP 服務器，以便為您網站的訪問者提供index.html ，並對/static/js/main.<hash>.js等靜態路徑的請求與/static/js/main.<hash>.js文件。

Answer 3

1- React 項目可以在 linux 主機上正常工作嗎？

是的，它適用於所有網絡服務器，除非您有服務器端渲染 (SSR)

2- 我需要將我所有的項目上傳到 ftp 嗎？ 因為 node_modules 目錄中有大約 20.000 個文件。

node_modules 中的文件不會轉到您的 Web 服務器。 這些是僅在開發期間使用的開發依賴文件。

1. 運行 npm run build
2. 這將在項目根目錄中創建一個名為build的文件夾。 這將包含所有 html、css、圖像和 js 文件
3. 將build文件夾中的所有文件和文件夾復制到您的站點根目錄。

如果您的網站必須托管在根目錄下的子文件夾中，您需要執行以下操作，否則您將看到一個空白頁面。 這是因為您的靜態文件（css、js 等）沒有正確加載。

打開 package.json 添加一個新的入口homepage: /your_subfolder/

它看起來像這樣

現在執行上述步驟，您的網站應該可以正常工作