Home  >  Article  >  Web Front-end  >  Detailed explanation of React quick-start scaffolding create-react-app

Detailed explanation of React quick-start scaffolding create-react-app

零下一度
零下一度Original
2017-06-24 13:57:341988browse

1. Quickly get started with React scaffolding create-react-app

In order to quickly build projects using React, FaceBook officially released a no-configuration , create-react-app, a scaffolding tool used to quickly build a development environment.
Of course, if you need a React Native scaffolding project, you can check here: create-react-native-app

Reasons for use and features:

  • No configuration required;

  • Integrated support for React, JSX, ES6 and Flow;

  • Integrated development server;

  • The browser hot loading function is configured;

  • You can directly import CSS and images in JavaScript;

  • Automatically handles CSS compatibility issues without adding the -webkit prefix;

  • integrates the compilation command and publishes it directly into the product after compilation. And also includes sourcemaps.

Detailed explanation of React quick-start scaffolding create-react-app

2. Installation of create-react-app

Use npm to execute the installation command on the command linenpm install - g create-react-app, pay attention to the need to add the g parameter for global installation and permission issues.

Detailed explanation of React quick-start scaffolding create-react-app

Detailed explanation of React quick-start scaffolding create-react-app

Detailed explanation of React quick-start scaffolding create-react-app

After installation, execute the run command npm start to browse The server sees the running results and has implemented the hot reloading function.

Detailed explanation of React quick-start scaffolding create-react-app

3. Several points to note

  • Node version must be >= 4, Node >= 6 is recommended and npm >= 3;

  • After running, the browser has implemented hot loading refresh. After modifying the code and saving it, the browser will automatically refresh;

  • Execute npm test or yarn test You can perform test actions, please see here for more information;

  • Compile project executionnpm run build or yarn build

  • For more usage guides, please plug in here.

The above is the detailed content of Detailed explanation of React quick-start scaffolding create-react-app. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn