React複習一

一、生產版本
發佈前確保已部署的HTML加載了以product.min.js結尾的React版本,那麼你的網站是生產就緒的

<script src="https://unpkg.com/react@16/umd/react.production.min.js" crossorigin></script>
<script src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js" crossorigin></script>

二、推薦工具鏈
React 團隊主要推薦這些解決方案:

如果你是在學習 React 或創建一個新的單頁應用,請使用 Create React App。
如果你是在用 Node.js 構建服務端渲染的網站,試試 Next.js。
如果你是在構建面向內容的靜態網站,試試 Gatsby。
如果你是在打造組件庫或將 React 集成到現有代碼倉庫,嘗試更靈活的工具鏈。
三、Create React App
Node >= 8.10 和 npm >= 5.6

npx create-react-app my-app
cd my-app
npm start

內部使用 Babel 和 webpack

Next.js
Next.js 是一個流行的、輕量級的框架,用於配合 React 打造靜態化和服務端渲染應用。它包括開箱即用的樣式和路由方案,並且假定你使用 Node.js 作爲服務器環境。

Gatsby
Gatsby 是用 React 創建靜態網站的最佳方式。它讓你能使用 React 組件,但輸出預渲染的 HTML 和 CSS 以保證最快的加載速度。

從頭開始打造工具鏈
一組 JavaScript 構建工具鏈通常由這些組成:

一個 package 管理器,比如 Yarn 或 npm。它能讓你充分利用龐大的第三方 package 的生態系統,並且輕鬆地安裝或更新它們。

一個打包器,比如 webpack 或 Parcel。它能讓你編寫模塊化代碼,並將它們組合在一起成爲小的 package,以優化加載時間。

一個編譯器,例如 Babel。它能讓你編寫的新版本 JavaScript 代碼,在舊版瀏覽器中依然能夠工作。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章