React学习之路 -- React脚手架搭建项目

[hezizi]

前言

写此系列博客的目的是对所学React知识点的总结和梳理，包括填坑方案分享，希望能帮助到还并不会使用React的开发者入门React

React官方文档
React中文文档
React社区

项目搭建

按照官方提供的create-react-app搭建项目

• 全局安装create-react-app

  cnpm i create-react-app -g
  或
  cnpm i yarn -g
yarn global add create-react-app

• 全局安装后可以使用create-react-app这条命令

  创建react-demo文件夹
  create-react-app react-demo

• 启动项目

  cd react-demo
npm start
  或
  yarn start

如果node 6+ 并且 npm 5.2+，可以使用npx安装

npx create-react-app react-demo
或
yarn create react-app react-demo (yarn 0.25+)
cd react-demo
npm start

目录结构

public/index.html页面入口文件,
src/App.js根组件，
src/App.css根组件样式文件，
src/index.js程序入口文件，
src/index.css页面样式文件，
App.test.js和serviceWorker.js暂时不会使用，可以删除

运行项目

yarn start

项目运行成功

下篇博客

React组件