React 项目创建与文件基础结构关系

点击查看react官方文档

javascript 复制代码
//index.js
//整个项目的入口,项目从此开始运行

//导入react和react-dom两个必要的核心包
import React from 'react';
import ReactDOM from 'react-dom/client';

//导入App组件(根组件)
import App from './App';

//把App根组件渲染到id为root的dom节点上,在public/index.html中定义
const root = ReactDOM.createRoot(document.getElementById('root'));

 使用 ReactDOM 创建的 root 实例将 App 组件渲染到指定的 DOM 节点上
root.render(<App />);
javascript 复制代码
//App.js
//项目的根组件,一切组件都要从这里开始
//App 被引入 index.js 再被渲染到 public/index.html(div.root)

function App() {
  return (
    <div className="App">
      <h1>Hello CodeSandbox</h1>
    </div>
  );
}

export default App;
相关推荐
灵感__idea5 小时前
JavaScript高级程序设计(第5版):好的编程就是掌控感
前端·javascript·程序员
烛阴6 小时前
Mix
前端·webgl
代码续发6 小时前
前端组件梳理
前端
试图让你心动7 小时前
原生input添加删除图标类似vue里面移入显示删除[jquery]
前端·vue.js·jquery
陈不知代码7 小时前
uniapp创建vue3+ts+pinia+sass项目
前端·uni-app·sass
小王码农记7 小时前
sass中@mixin与 @include
前端·sass
陈琦鹏7 小时前
轻松管理 WebSocket 连接!easy-websocket-client
前端·vue.js·websocket
hui函数8 小时前
掌握JavaScript函数封装与作用域
前端·javascript
行板Andante8 小时前
前端设计中如何在鼠标悬浮时同步修改块内样式
前端
Carlos_sam9 小时前
Opnelayers:ol-wind之Field 类属性和方法详解
前端·javascript