自学内容网 自学内容网
自学内容网 > 正文

React01 开发环境搭建

🕗 发布于 2024-10-13 09:14 javascript  react.js  前端  

React 开发环境搭建

一、创建 React 项目

  • 执行下述命令创建 react 项目 blu-react-basis
npx create-react-app blu-react-basis

项目目录结构如下：

在这里插入图片描述

  • 执行下述命令启动项目
npm run start

启动效果如下：

在这里插入图片描述

二、项目精简

删除不必要的文件

在这里插入图片描述

简化 index.js 和 App.js

  • index.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
//根组件
function App() {
  return (
    <div className="App">
      HELLO BLU FROM REACT
    </div>
  );
}
export default App;

原文地址：https://blog.csdn.net/BLU_111/article/details/142891223

免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！

相关文章

自学内容网
Copyright © 2015-2024