此文简单讲解了官方 React 快速上手脚手架的安装与介绍。

1. React 快速上手脚手架 create-react-app

为了快速地进行构建使用 React 的项目，FaceBook 官方发布了一个无需配置的、用于快速构建开发环境的脚手架工具 create-react-app。
当然，如果你需要 React Native 的脚手架项目，可以查看这里：create-react-native-app

使用的原因以及特性：

  • 无需配置；
  • 集成了对 React, JSX, ES6 和 Flow 的支持；
  • 集成了开发服务器；
  • 配置好了浏览器热加载的功能；
  • 在 JavaScript 中可以直接 import CSS 和图片；
  • 自动处理 CSS 的兼容问题，无需添加 -webkit 前缀；
  • 集成好了编译命令，编译后直接发布成产品，并且还包含了 sourcemaps。

2. create-react-app 的安装

命令行中使用 npm 执行安装命令 npm install -g create-react-app，注意需要添加 g 参数进行全局安装以及权限的问题。

安装后执行运行命令 npm start 即可在浏览器看到运行后的结果，并且已经实现了热加载的功能。

3. 需要注意的几个点

  • Node 的版本必须 >= 4，推荐 Node >= 6 and npm >= 3；
  • 运行起来后浏览器已经实现了热加载刷新，修改代码保存后浏览器会自动刷新；
  • 执行 npm test 或 yarn test 可以执行测试动作，更多请参阅这里；
  • 编译项目执行 npm run build 或 yarn build；
  • 更多使用向导请插件这里。

官方 React 快速上手脚手架 create-react-app相关推荐

  1. react快速开始(二)-使用脚手架Create React App创建react应用

    文章目录 react快速开始(二)-Create React App入门 什么是Create React App 快速开始 使用IDE webstrom创建react项目 create react a ...

  2. react 快速上手开发_React中测试驱动开发的快速指南

    react 快速上手开发 by Michał Baranowski 通过MichałBaranowski React中测试驱动开发的快速指南 (A quick guide to test-driven ...

  3. React 快速上手 - 目录索引

    React 快速上手 - 目录索引 1~10 完整版 因为一开始在 SF 上写文,后来尝试 掘金 ,所有会有跨站地址,不要惊慌? ~~~ 对了 点赞是美德 : ) 目录 01 前言 02 开发环境搭建 ...

  4. React 快速上手

    React 快速上手 开始 开始一个React的项目. npx create-react-app my-app 注意:Node >= 8.10 和 npm >= 5.6,npx是 npm ...

  5. 给前端快速上手摸鱼一把主流状态管理库，这家伙真香

    前言 大家好,我是虚竹. 众所周知,React是一个专注于UI层的库,不同于Vue.Angular等框架,React 的各种状态管理方案一直是在百花齐放.群魔乱舞.除了热门库Redux.Mobx.Re ...

  6. react-router-dom v6快速上手

    React Router 6 快速上手 1.概述 React Router 以三个不同的包发布到 npm 上,它们分别为: react-router: 路由的核心库,提供了很多的:组件.钩子. rea ...

  7. Vue2.0快速上手-重要知识点罗列-系列一

    Vue2.0快速上手 脚手架文件结构 ├── node_modules ├── public │ ├── favicon.ico: 页签图标 │ └── index.html: 主页面 ├── src ...

  8. 利用 Create React Native App 快速创建 React Native 应用

    React Native App简介 打开React Native官方文档你会发现,在Getting Started章节下新添加一个Quick Start Tab页.Quick Start是在v0.4 ...

  9. Create React App从使用到Docker部署

    一.介绍 Create React App 是 React 脚手架,它帮我们可以快速生成项目的工程化结构,脚手架让项目从搭建到开发再到部署,整个流程变得快速和便捷. 二.安装 Create React ...

最新文章

  1. 较高人工智能的人机博弈程序实现(多个算法结合)含C++源码
  2. Python GUI编程--Tkinter
  3. Acwing第 41 场周赛【完结】
  4. bootstrap-table全选当前页所有数据checkAll
  5. 绑定流详解——网络测试仪实操
  6. java项目根目录_获取java项目的根目录
  7. C语言五子棋双人模式
  8. cmd 新增dns_用CMD设置IP DNS的方法
  9. android商店账号密码错误,android app 自定义签名出现错误：Keystore was tampered with, or password was incorrect...
  10. Windows下桌面便签小工具--StickyPad简单使用教程（非StickyNotes）
  11. 关于如何开启本地代理隐藏本地ip
  12. 每个互联网人才都应该知道的SQL注入
  13. flowchart流程图编程语言下载_流程图(flowchart)
  14. 【论文阅读记录】孪生网络（Siamese network）
  15. python_faker使用
  16. ubuntu16.04 安装 oracle11g （2022.6.5）
  17. Mesos Architecture
  18. 系统集成项目管理工程师（软考中级）—— 第二十三章 风险管理 笔记分享
  19. poi-ooxml 简介、中文文档、中英对照文档 下载
  20. 【老生谈算法】matlab实现视频图像增强和去雾算法——去雾算法

热门文章

  1. python 倒计时功能怎么用print实现_python 实现倒计时功能(gui界面)
  2. 工作日总结: 2022-01-21
  3. 网页右边固定php,左侧固定，右侧自适应的布局方式
  4. 如何搭建mysql的学习环境_Mysql学习笔记【一、环境安装配置】
  5. mysql深入浅出_《深入浅出mysql》学习笔记
  6. java移动端接口测试_移动端质量体系之性能测试(上）
  7. C++应用程序性能优化（三）——C++语言特性性能分析
  8. PHP - 逗号和点号的区别
  9. 阿里九峰:云计算开启的基础设施新时代
  10. CentOS7上Mongodb安装、卸载