快速开始

开发工具

推荐使用vscodeopen in new window,进行项目开发,cool-admin为其内置了一些代码片段,加快开发效率。

当然你也可以使用webstromopen in new window等其他适合开发node项目的工具。

代码片段

框架为vscodeopen in new window内置了一些代码片段,加快开发效率

  • entity,实体类(表结构);
  • config,模块配置;
  • controller,控制器(API接口);
  • event,事件监听;
  • middleware,中间件,处理请求之前,请求之后的动作;
  • queue,队列;
  • service,服务(处理业务逻辑);

只需输入对应的关键字即可快速生成代码,如:快速创建entity

拉取代码

Github

https://github.com/cool-team-official/cool-admin-midwayopen in new window

Gitee

如果你的网络不佳,推荐gitee拉取代码

https://gitee.com/cool-team-official/cool-admin-midwayopen in new window

git clone https://github.com/cool-team-official/cool-admin-midway.git



git clone https://gitee.com/cool-team-official/cool-admin-midway.git

代码目录

项目主要目录结构

 ├── .vscode(代码片段,根据关键字可以快速地生成代码)   
 ├── public(静态资源文件,如js、css或者上传的文件)
 ├── src                           
 │   └── comm(通用库)
 │   └── modules(项目模块)                 
 │   └── config
 │   │    └── config.default.ts(默认配置,不区分环境,都生效)
 │   │    └── config.local.ts(本地开发配置,对应npm run dev)
 │   │    └── config.prod.ts(生产环境配置,对应npm run start)
 │   │    └── plugin.ts(插件配置)
 │   └── configuration.ts(midway的配置文件)
 │   └── welcome.ts(环境的controller)
 │   └── interface.ts(类型声明)
 ├── test  
 ├── package.json(依赖管理,项目信息)
 ├── bootstrap.js(生产环境启动入口文件,可借助pm2等工具多进程启动)
 ├── server.js(生产环境cfork方式启动入口文件,多进程)
 └── tsconfig.json

模块目录,这是一个推荐的目录除了controllerconfig.tsinit.sql其他目录可自由定义

 ├── modules                           
 │   └── base(基础的权限管理系统)
 │   │    └── controller(api接口)
 │   │    └── dto(参数校验)
 │   │    └── entity(实体类)
 │   │    └── middleware(中间件)     
 │   │    └── schedule(定时任务)        
 │   │    └── service(服务,写业务逻辑)           
 │   │    └── config.ts(必须,模块的配置)
 │   │    └── init.sql(可选,初始化该模块的sql)
 

提示

编码时应该有你自己的编码规范,好的编码规范可以更好地合作以及避免一些莫名其妙的错误

自动格式化

1、vscode按照EsLint插件; 2、打开vscode的setting.json, 文件/首选项/设置/打开设置json/, 配置保存自动格式化:

// #每次保存的时候将代码按eslint格式进行修复
"editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
},

配置运行

环境要求

提示

即使不配置redisopen in new windowmidwayjsopen in new window也自带本地定时任务功能open in new window,可以满足部分需求,只是无法使用admin的界面操作。

数据库配置

src/config/config.local.ts

import { MidwayConfig } from '@midwayjs/core';

/**
 * 本地开发 npm run dev 读取的配置文件
 */
export default {
  orm: {
    type: 'mysql',
    host: '127.0.0.1',
    port: 3306,
    username: 'root',
    password: '123456',
    database: 'cool',
    // 自动建表 注意:线上部署的时候不要使用,有可能导致数据丢失
    synchronize: true,
    // 打印日志
    logging: true,
    // 字符集
    charset: 'utf8mb4',
  },
} as MidwayConfig;

运行

安装依赖

切换到项目根目录,与package.json同级

yarn
npm i

提示

如果你的网络不佳,安装依赖需要很长时间,可以切换为阿里镜像源open in new window

DANGER

windows下安装cnpm后,在vscode的终端运行有可能会出现如下错误:xxx : 无法将“xxx”项识别为 cmdlet、函数、脚本文件或可运行程序的名称

解决方法:

  • 右击VSCode图标,选择以管理员身份运行;
  • 在终端中执行get-ExecutionPolicy,显示Restricted,表示状态是禁止的;
  • 这时执行set-ExecutionPolicy RemoteSigned;
  • 此时再执行get-ExecutionPolicy,显示RemoteSigned,则表示状态解禁,可以运行

启动

切换到项目根目录,与package.json同级

yarn dev
npm run dev

提示

框架会自动导入数据库,无需手动导入

访问http://127.0.0.1:8001open in new window,出现以下界面代表运行成功

快速CRUD

大部分的后台管理系统,或者 API 服务都是对数据进行管理,所以可以看到大量的 CRUD 场景(增删改查),cool-admin 对此进行了大量地封装,让这块的编码量变得极其地少。

创建表

src/modules/demo/entity/goods.ts

import { EntityModel } from '@midwayjs/orm';
import { BaseEntity } from '@cool-midway/core';
import { Column } from 'typeorm';

/**
 * 商品
 */
@EntityModel('demo_goods')
export class DemoGoodsEntity extends BaseEntity {
  @Column({ comment: '标题' })
  title: string;

  @Column({ comment: '图片' })
  pic: string;

  @Column({ comment: '价格', type: 'decimal', precision: 5, scale: 2 })
  price: number;

  @Column({ comment: '分类', type: 'tinyint', default: 0 })
  type: number;
}

提示

运行代码框架会自动创建表,无需在数据库手动创建

编写接口

src/modules/demo/controller/app/goods.ts

import { DemoGoodsEntity } from '../../entity/goods';
import { BaseController, CoolController } from '@cool-midway/core';
import { DemoGoodsService } from '../../service/goods';

/**
 * 测试
 */
@CoolController({
  api: ['add', 'delete', 'update', 'info', 'page', 'list'],
  entity: DemoGoodsEntity,
})
export class CoolGoodsController extends BaseController {}

这样我们就完成了 6 个接口的编写,可以看到代码量是极少的,对应的接口如下:

  • POST /app/demo/goods/add 新增
  • POST /app/demo/goods/delete 删除
  • POST /app/demo/goods/update 更新
  • GET /app/demo/goods/info 单个信息
  • POST /app/demo/goods/list 列表信息
  • POST /app/demo/goods/page 分页查询(包含模糊查询、字段全匹配等)

调用接口

提示

POST方法的参数都是放在请求body当中,格式是JSON,GET方法参数为URL参数

没有指定路由地址,是因为模块的controller路由是按照一定规则自动生成的,当然你也可以手动指定,但是我们并不建议你这么做

Last Updated: