小小又进入了学习状态，此时小小因为最近接触了js的相干内容，进而接触了一些ts相干的内容，所以小小本次次要学习的内容是ts。
装置相干依赖
这里装置两个依赖，别离为egg和ts
装置ts
这里须要确保首先装置了npm相干工具。
全局装置ts
npm install -g typescript进行全局的测试
$ tsc -vVersion 3.2.2这样就实现了本地全局的ts的装置
装置egg
这里实现全局装置egg，并初始化依赖我的项目。
创立工作目录
mkdir showcase && cd showcase装置相干的依赖
npm init egg --type=ts装置依赖
npm i运行我的项目
npm run dev呈现以下提醒，即代表曾经启动，并装置实现
C:\Users\Administrator\Desktop\untitled4555\ming>npm run dev> ming@1.0.0 dev C:\Users\Administrator\Desktop\untitled4555\ming> egg-bin dev[egg-ts-helper] create typings\app\controller\index.d.ts (5ms)[egg-ts-helper] create typings\config\index.d.ts (16ms)[egg-ts-helper] create typings\config\plugin.d.ts (10ms)[egg-ts-helper] create typings\app\service\index.d.ts (5ms)[egg-ts-helper] create typings\app\index.d.ts (2ms)2020-07-31 14:27:49,701 INFO 12416 [master] node version v13.11.02020-07-31 14:27:49,703 INFO 12416 [master] egg version 2.27.02020-07-31 14:27:59,512 INFO 12416 [master] agent_worker#1:28076 started (9799ms)2020-07-31 14:28:10,469 INFO 12416 [master] egg started on http://127.0.0.1:7001 (20765ms)拜访页面成果如上
编写控制器
这里编写相应的控制器
控制器目录如下所示
增加绝对应的类的办法
public async show() { const { ctx } = this; // eslint-disable-next-line @typescript-eslint/no-unused-vars const page = ctx.query.page; console.log(page); const result = 'ming'; console.log(result); await ctx.render('ming.tpl', result); }增加相干路由
import { Application } from 'egg';export default (app: Application) => { const { controller, router } = app; router.get('/', controller.home.index); router.get('/ming', controller.home.show);};增加模板渲染插件
编辑默认配置文件
import { EggAppConfig, EggAppInfo, PowerPartial } from 'egg';export default (appInfo: EggAppInfo) => { const config = {} as PowerPartial<EggAppConfig>; // override config from framework / plugin // use for cookie sign key, should change to your own and keep security config.keys = appInfo.name + '_1596175919808_6331'; // add your egg config in here config.middleware = []; // add your special config in here const bizConfig = { sourceUrl: `https://github.com/eggjs/examples/tree/master/${appInfo.name}`, }; config.view = { defaultViewEngine: 'nunjucks', mapping: { '.tpl': 'nunjucks', }, }; // the return config will combines to EggAppConfig return { ...config, ...bizConfig, };};增加相干插件
import { EggPlugin } from 'egg';const plugin: EggPlugin = { nunjucks: { enable: true, package: 'egg-view-nunjucks', },};export default plugin;拜访链接
http://127.0.0.1:7001/ming呈现模板内容
服务层编写
这里配置相干的服务层。
定义相干接口
export interface NewsItem { id: number; title: string;}编写相干的控制器
// 定义相干办法 // eslint-disable-next-line @typescript-eslint/no-unused-vars public async list(name: number): Promise<NewsItem[]>{ name = name; return [{id:3, title: "ming"}] ; }在管制层中调用
public async show() { const { ctx } = this; // eslint-disable-next-line @typescript-eslint/no-unused-vars const page = ctx.query.page; console.log(page); const result = 'ming'; console.log(result); await ctx.render('ming.tpl', result); }调用显示后果
此时实现了最根本的服务层的搭建
中间件
中间件个别用于jwt验证相干的内容。这里应用jwt做前后端的验证。
创立新的中间件目录
import { Context, Application, EggAppConfig } from "egg";export default function uuidMiddleWare(options: EggAppConfig['uuid'], app: Application): any { return async (ctx: Context, next: () => Promise<any>) => { // name 就是 config.default.js 中 uuid 下的属性 ctx = ctx; console.info(options.name); await next(); };}创立相干的配置文件用于中间件读取相干的内容
config.default.js import { EggAppConfig, EggAppInfo, PowerPartial } from 'egg';export default (appInfo: EggAppInfo) => { const config = {} as PowerPartial<EggAppConfig>; // override config from framework / plugin // use for cookie sign key, should change to your own and keep security config.keys = appInfo.name + '_1596175919808_6331'; // add your egg config in here config.middleware = ['uuid']; // add your special config in here const bizConfig = { sourceUrl: `https://github.com/eggjs/examples/tree/master/${appInfo.name}`, local: { msg: 'local', }, uuid: { name: 'ebuuid', maxAge: 1000 * 60 * 60 * 24 * 365 * 10, }, }; config.view = { defaultViewEngine: 'nunjucks', mapping: { '.tpl': 'nunjucks', }, }; // the return config will combines to EggAppConfig return { ...config, ...bizConfig, };};读取成果如下