React01 开发环境搭建

React 开发环境搭建

一、创建 React 项目

  • 执行下述命令创建 react 项目 blu-react-basis
bash 复制代码
npx create-react-app blu-react-basis

项目目录结构如下:

  • 执行下述命令启动项目
bash 复制代码
npm run start

启动效果如下:

二、项目精简

删除不必要的文件

简化 index.jsApp.js

  • index.js
js 复制代码
//导入React必要的两个核心包
import React from 'react';
import ReactDOM from 'react-dom/client';

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

//将根组件渲染到index.html中id为root的dom节点上
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(<App/>);
  • App.js
js 复制代码
//根组件
function App() {
  return (
    <div className="App">
      HELLO BLU FROM REACT
    </div>
  );
}
export default App;
相关推荐
木易 士心28 分钟前
Promise深度解析:前端异步编程的核心
前端·javascript
im_AMBER31 分钟前
Web 开发 21
前端·学习
又是忙碌的一天32 分钟前
前端学习day01
前端·学习·html
Joker Zxc35 分钟前
【前端基础】20、CSS属性——transform、translate、transition
前端·css
excel40 分钟前
深入解析 Vue 3 源码:computed 的底层实现原理
前端·javascript·vue.js
大前端helloworld1 小时前
前端梳理体系从常问问题去完善-框架篇(react生态)
前端
不会算法的小灰1 小时前
HTML简单入门—— 基础标签与路径解析
前端·算法·html
zero13_小葵司1 小时前
在Vue项目中构建后端配置的动态路由及权限控制体系
前端·javascript·vue.js
GISer_Jing1 小时前
前端框架篇——Vue&React篇
前端·javascript
面向星辰1 小时前
css其他选择器(精细修饰)
前端·css