一、生产版本
发布前确保已部署的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 代码,在旧版浏览器中依然能够工作。