2017-04-05 98 views
1

我在我的最新項目中使用create-react-app,這太棒了!現在我面臨着一個我不確定如何正確解決的問題。在服務器上創建反應應用渲染組件

我已經創建了應用程序使用REDX我的狀態管理,並且一切運作良好。

現在我對React中的服務器端渲染沒有太多實驗,但對於我的下一個功能,我需要將現有/正在運行的反應組件之一(連接到redux存儲)並呈現它服務器附帶create-react-app。我想這樣做的原因是能夠使用像PDF生成器和simillar一些庫,以便能夠打印出他們中的一些(還有一些其他的東西,但這是基本的)。

我很困惑的第一件事,因爲我不想在服務器上渲染所有東西,所以運行webpack-dev服務器和節點服務器的最佳/正確方式(用於開發)上面提到的並行而不是僅僅改變它的默認端口爲8000,然後手動運行它?我應該能夠在服務器上的現有組件上使用ReactDOMServer.renderToString,還是有其他東西會使東西變得複雜(我知道我需要在服務器definitaly上添加babel)?

+3

create-react-app不支持服務器端渲染呢! –

回答

1

創建React App不支持服務器渲染。你可能想要遷移到Next.js。

+0

嘿,夥計!非常感謝您的回答! 好的將檢查它,但與當前的設置,我應該能夠通過使用renderToStaticMarkup(將包括babel ofc)在我的服務器上獲取現有組件的HTML?我只是不想在客戶端上進行pdf渲染,所以在server.js裏我可以使用html-pdf lib或者類似的東西? –

+0

是啊?我不太瞭解您的使用案例以提供更多詳細信息。 –

+0

是的,我設法做到了,謝謝你,只需要將babel加載到服務器,包含組件,將它傳遞給renderToStaticMarkup,然後使用html創建pdf,使用html-pdf lib作爲node.js –

0

不幸的是,創建反應應用程序(CRA)沒有可擴展性來允許這一點。但是,CRA的版本稍有變化,允許使用常規CRA流水線編譯,測試和運行客戶端和服務器端代碼 - npm start將編譯和啓動應用程序的cient端和服務器端部分,使用Webpack的單個實例,在同一個HTTP端口上。

你可以通過訪問React App SDK找到更多的信息。