创建react项目

最新推荐文章于 2024-07-24 11:09:48 发布

Beamon__

最新推荐文章于 2024-07-24 11:09:48 发布

阅读量150

点赞数

分类专栏： react 文章标签： reactjs react.js 前端 Powered by 金山文档

本文链接：https://blog.csdn.net/Beamon__/article/details/128630950

版权

react 专栏收录该内容

13 篇文章 1 订阅

订阅专栏

本文介绍了如何通过命令行使用npm或yarn创建React项目，包括不同npm版本下的指令。创建后，项目包含assets、components等目录结构，并提供了启动、打包和eject配置的脚本说明。此外，提到了eject操作的不可逆性以及项目目录结构的详细内容。

摘要由CSDN通过智能技术生成

通过命令行指令创建空白项目

npm：

# npm版本大于5.2
npx create-react-app my-app

# npm版本小于等于5.2
npm init react-app my-app

yarn：

yarn create react-app 项目名称

在src目录下新建文件夹assets、components、router、utils、views

去不全README.md文档

# 个人项目练习

项目脚手架 [Create React App](https://github.com/facebook/create-react-app).

## 脚本说明

##### 启动项目

`yarn start`
默认端口 [http://localhost:3000](http://localhost:3000)

##### 打包项目

`yarn build`
打包部署参考文档 [官网](https://facebook.github.io/create-react-app/docs/deployment)

##### 释放项目 webpack 配置

`yarn eject`

###### 注意: `eject` 是一个单向操作，无法回退，操作前请提交先代码

## 项目目录

```
|--public：静态资源
|--src：业务代码
  |--assets：静态资源
  |--components：公共组件
  |--router：路由配置
  |--utils：工具集
  |--views：页面配置
  |--App.css：根组件样式
  |--App.js：根组件
  |--index.css：入口文件css
  |--index.js：入口文件
|--.gitignore：git 配置
|--package.json：依赖包管理
|--README.md：项目说明文件
|--yarn.lock：依赖包版本管理
```