react开发环境创建

 React介绍

React由Meta公司开发，是一个用于 构建Web和原生交互界面的库

## React的优势

相较于传统基于DOM开发的优势

1. 组件化的开发方式

2. 不错的性能

相较于其它前端框架的优势

1. 丰富的生态

2. 跨平台支持

# 开发环境创建

create-react-app是一个快速创建React开发环境的工具，底层由Webpack构件，封装了配置细节，开箱即用

执行命令：npx create-react-app react-basic

1. npx -  Node.js工具命令，查找并执行后续的包命令

2. create-react-app - 核心包（固定写法），用于创建React项目

3. react-basic  React项目的名称（可以自定义）

package.json中的核心代码

"react": "^18.3.1", "react-dom": "^18.3.1",

调试命令

"start": "react-scripts start"开发命令,  "build": "react-scripts build"打包命令,

核心逻辑

//整个项目的入口从这里开始


//react必要的俩个核心包
import React from 'react';
import ReactDOM from 'react-dom/client';


//导入我们项目的根组件
import App from './App';

//把我们的app的根组件渲染到id为root的Dom节点上 在index.js中 <div id="root"></div>
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render( <App />)

app.js代码

//项目的根组件，一切组件的根基

// APP--index.js--->pubilc/index.html ---><div id="root"></div>
function App() {
  return (
    <div className="App">
     this.App
    </div>
  )
}

export default App;