UmiJS学习

2024-01-10 16:18:00

支持

  1. node14+
  2. IE9+

一般使用项目场景

  1. react + umi + ts + less
  2. AntdPro 中后台

目录结构

├── config
│   └── config.ts // 默认设置,路由,代理,主题
│   └── route.ts
├── dist // 打包文件
├── mock // 假数据
│   └── app.ts|tsx
├── src 
│   ├── .umi // 临时文件,项目有时候新npm i 模块要删掉这个目录重新运行
│   ├── .umi-production
│   ├── pages // 约定页面目录
│   │   └── index.less
│   │   └── index.tsx
│   ├── utils // 功能性函数:为了提高代码的可维护性、可读性和可复用性,按需调用
│   │   └── index.ts // 函数 function
│   │   └── constant.tsx // 对象{} 数组[{label: '1',value:'1'}]
│   │   └── other.tsx // downloadFile, md5等
│   ├── 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 选一
├── package.json
├── tsconfig.json
└── typings.d.ts

使用特色

  1. 约定式路由:/src/pages/…/index.tsx
  2. 约定式css:/src/pages/…/index.less

文章来源:https://blog.csdn.net/weixin_45549967/article/details/135503137
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。