umi框架开发移动端h5

1、官网:https://umijs.org/

2、创建出来的项目

bash 复制代码
yarn create umi
yarn start

3、推荐目录结构

.

├── config

│ └── config.ts

├── public//静态资源

├── dist

├── mock

│ └── app.ts|tsx

├── src

│ ├── .umi

│ ├── .umi-production

│ ├── layouts

│ │ ├── BasicLayout.tsx

│ │ ├── index.less

│ ├── models

│ │ ├── global.ts

│ │ └── index.ts

│ ├── pages

│ │ ├── index.less

│ │ └── index.tsx

│ ├── utils // 推荐目录

│ │ └── index.ts

│ ├── services // 推荐目录

│ │ └── api.ts

│ ├── app.(ts|tsx)

│ ├── global.ts

│ ├── global.(css|less|sass|scss)

│ ├── overrides.(css|less|sass|scss)

│ ├── favicon.(ico|gif|png|jpg|jpeg|svg|avif|webp)

│ └── loading.(tsx|jsx)

├── node_modules

│ └── .cache

│ ├── bundler-webpack

│ ├── mfsu

│ └── mfsu-deps

├── .env //环境变量

├── plugin.ts

├── .umirc.ts // 与 config/config 文件 2 选一 ,对webpack进行配置

├── package.json

├── tsconfig.json

└── typings.d.ts

4、config/config.ts

直接把.umirc.ts复制过来的,route中的组件都不需要写导入,非运行时配置(webpack配置)。


相关推荐
在未来等你1 天前
AI Agent设计模式 Day 1:ReAct模式:推理与行动的完美结合
设计模式·llm·react·ai agent·plan-and-execute
写完这行代码打球去2 天前
Umi 数据预加载功能详解
react
Zzzzzxl_3 天前
互联网大厂前端面试实录:HTML5、ES6、Vue/React、工程化与性能优化全覆盖
性能优化·vue·es6·react·html5·前端面试·前端工程化
老李说技术4 天前
React 中 useCallback 的基本使用和原理解析
react
csj505 天前
前端基础之《React(7)—webpack简介-ESLint集成》
前端·react
老李说技术5 天前
React中useContext的基本使用和原理解析
react
w2sfot6 天前
如何将React自定义语法转化为标准JavaScript语法?
javascript·react
rengang667 天前
502-Spring AI Alibaba React Agent 功能完整案例
人工智能·spring·agent·react·spring ai·ai应用编程
csj508 天前
前端基础之《React(6)—webpack简介-图片模块处理》
前端·react
!win !8 天前
从一个按钮实例入门CSS in JS之styled-components
css·react