当前位置: 首页 > news >正文

react脚手架(creat-react-app)

安装 react脚手架

React官方提供的脚手架工程Create React App:https://github.com/facebook/create-react-app

npm install create-react-app -g 全局安装
create-react-app my-react (my-react为项目名称,可以自定义)
cd my-react
启动项目:npm start
成功如下图:


my-react.jpg

react脚手架目录结构

react.jpg

可以把脚手架目录结构精简为如下图:


react-1.jpg
入口文件:index.js
// 导入核心模块
import React from 'react'
import ReactDOM from 'react-dom'
// 入口组件
import App from './App.jsx'

ReactDOM.render(<App />, document.getElementById('root'))
存放组件的文件夹:component
入口组件:App.jsx
// 根目录
import React from 'react'
import Home from './component/Home.jsx'
class App extends React.Component {
  render() {
    return (<Home />)
  }
}
export default App
Home.jsx
import React from 'react'
export default class Home extends React.Component {
  render() {
    return <div>首页</div>
  }
}


喜欢的朋友记得点赞、收藏、关注哦!!!

相关文章:

  • FreeRTOS 任务间通信机制:队列、信号量、事件标志组详解与实验
  • RabbitMQ 高级特性:从 TTL 到消息分发的全面解析 (下)
  • Spring Boot静态资源访问顺序
  • redis有哪几种持久化方式
  • 通过数据库网格架构构建现代分布式数据系统
  • 顺序表与链表·续
  • Xshell链接Linux机器更换jdk版本
  • 基于架构的软件开发(ABSD)
  • C++11新特性1.原始字面量
  • 学之思社区版考试系统docker-compose部署
  • Selenium 中 ActionChains 支持的鼠标和键盘操作设置及最佳实践
  • Java入门:环境搭建与第一个HelloWorld程序
  • 八点八数字科技:AI数字人引领智慧文旅新时代
  • SyntaxError: Unterminated string literal
  • ReAct论文阅读笔记总结
  • Docker 搭建本地 cnpm 私有仓库
  • 【数据库系统概论】第一章 绪论
  • 奇安信 2025 年护网蓝队初选笔试题(附答案解析)
  • 一网打尽:文本、图像与变体的统一扩散模型
  • 【Linux】——初识操作系统
  • 网站建设中什么意思/服务营销理论
  • 沈阳做企业网站的公司/2023年6月份疫情严重吗
  • 黄石做网站建设的/百度排名点击器
  • 免费制作一个自己的网站吗/服务营销的七个要素
  • 校园网站建设途径/宣传广告
  • 做视频网站玩什么配置/关键词优化公司费用多少