{"id":20542202,"url":"https://github.com/weivea/micro-fe","last_synced_at":"2026-04-20T01:33:57.769Z","repository":{"id":83302422,"uuid":"127688678","full_name":"weivea/micro-fe","owner":"weivea","description":"微前端框架","archived":false,"fork":false,"pushed_at":"2018-04-26T08:11:04.000Z","size":171,"stargazers_count":3,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-06T04:29:22.508Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/weivea.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2018-04-02T01:51:28.000Z","updated_at":"2019-03-07T03:33:55.000Z","dependencies_parsed_at":null,"dependency_job_id":"cf71a822-8e2a-4404-8388-c34d31c103e6","html_url":"https://github.com/weivea/micro-fe","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/weivea/micro-fe","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/weivea%2Fmicro-fe","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/weivea%2Fmicro-fe/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/weivea%2Fmicro-fe/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/weivea%2Fmicro-fe/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/weivea","download_url":"https://codeload.github.com/weivea/micro-fe/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/weivea%2Fmicro-fe/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32029713,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-20T00:18:06.643Z","status":"ssl_error","status_checked_at":"2026-04-20T00:17:31.068Z","response_time":55,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-16T01:29:46.468Z","updated_at":"2026-04-20T01:33:57.751Z","avatar_url":"https://github.com/weivea.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# micro-fe\n\n基于 koa 的 服务模块化\n\nkoa 可以理解为这样\n\n![洋葱圈](./img/yangcong.jpg)\n\n或者\n\n![中间件](./img/shuiping.jpeg)\n\nmicro-fe 可以理解位 多个 koa 的组合\n\n![模块化](./img/duoduoduo.jpeg)\n\n## 安装 install\n\n```\nnpm install micro-fe --save\n```\n\n## 使用 usage\n\n详细使用参见 [example](./example)\n\n```javascript\nconst Koa = require('Koa')\nconst MicroFe = require('../index')\nconst app = new Koa()\nconst mfvm = new MicroFe(app)\n\n//  有序插入中间件\n// 可以通过 mfvm.middlewareName来查看中间件情况，调整插入位置，\n// 也可以通过 mfvm.use({name, middleware}) , 默认添加到最后边\n// middleware中的this 指向mfvm实例\nmfvm.insert(0, {\n  name: 'test',\n  middleware: async (ctx, next) =\u003e {\n    await await (() =\u003e\n      new Promise((resolve, reject) =\u003e {\n        // 自运行返回Promise\n        setTimeout(() =\u003e {\n          ctx.testparam = 1\n          console.log('test123')\n          resolve()\n        }, 500)\n      }))()\n    await next()\n  }\n})\n\n// 还有mfvm.post,... 支持方法参见https://github.com/jshttp/methods， node支持的都支持\n// control中的this 指向mfvm实例\nmfvm.get('/api/:id', async function control(ctx) {\n  ctx.body = ctx.params.id\n})\nmfvm.get('/', async function(ctx) {\n  ctx.body = {\n    hello: 'world',\n    name: ctx.testparam\n  }\n})\n\n// 注册子服务\nmfvm.register('/sub', async function(mfvm) {\n  // 中间件\n  mfvm.use({\n    name: 'subtest',\n    middleware: async (ctx, next) =\u003e {\n      await await (() =\u003e\n        new Promise((resolve, reject) =\u003e {\n          setTimeout(() =\u003e {\n            ctx.testparam = 2\n            console.log('subtest123')\n            resolve()\n          }, 500)\n        }))()\n      await next()\n    }\n  })\n\n  mfvm.get('/api', async function(ctx) {\n    ctx.body = {\n      sub: 'api',\n      name: ctx.testparam\n    }\n  })\n})\n\napp.use(mf.routes())\n\napp.listen(3000)\n```\n\n## 方法以及属性\n\n### 路由\n\n**middleware中的`this` 指向`mfvm`实例**\n\n```javascript\nconst app = new Koa()\nconst mfvm = new MicroFe(app)\nmfvm\n  .get('/api/:id', async function(ctx) { // 非 async function 也OK\n    ctx.body = ctx.params.id\n  })\n  .post('/api2/:id', async function(ctx) {\n    ctx.body = ctx.params.id\n  })\n```\n\n### 中间件\n\n**control中的`this` 指向`mfvm`实例**\n\n```javascript\nconst app = new Koa()\nconst mfvm = new MicroFe(app)\n//  有序插入中间件\n// 可以通过 mfvm.middlewareName来查看中间件情况，调整插入位置，\n// 也可以通过 mfvm.use({name, middleware}) , 默认添加到最后边\nmfvm.insert(0, {\n  name: 'test',\n  middleware: async function(ctx, next) {\n    await await (() =\u003e\n      new Promise((resolve, reject) =\u003e {\n        // 自运行返回Promise\n        setTimeout(() =\u003e {\n          ctx.testparam = 1\n          console.log('test123')\n          resolve()\n        }, 500)\n      }))()\n    await next()\n  }\n})\nmfvm.use({\n  name: 'subtest',\n  middleware: async function(ctx, next) {\n    await await (() =\u003e\n      new Promise((resolve, reject) =\u003e {\n        setTimeout(() =\u003e {\n          ctx.testparam = 2\n          console.log('subtest123')\n          resolve()\n        }, 500)\n      }))()\n    await next()\n  }\n})\n```\n### 获取指定中间件名的位置\n\n```javascript\nconst index = mfvm.indexOfMiddleware(middlewareMame)\n```\n\n### 扩展ctx\n\n```javascript\nconst app = new Koa()\nconst mfvm = new MicroFe(app)\nmfvm.decorateCTX('extends1', async function(ctx) { // 非 async function 也OK\n  // 你的代码\n})\n```\n### 注册子服务\n\n参见 [example](./example)\n\n\n### app koa 实例\n\n```javascript\nthis.app // koa实例\n```\n\n### prefix: path 前缀\n\n```javascript\nthis.prefix // path前缀，跟实例为空\n```\n\n### parent: 父级实例，跟实例为空\n\n### root: 根父级实例 跟实例为空\n\n### middleware: 中间件列表\n\n### middlewareName: 中间件名儿列表\n\n### children: 子组件\n\n### ctxDecorateList: ctx 扩展列表\n\n\n## 功能扩展\n\nMicroFe本身是一个类，所以可继承扩展，\n\n```javascript\n// 扩展方法\nclass BigFe extends MicroFe {\n  constructor() {\n    super(arguments)\n  }\n  imBig() {\n    console.log('i`m bigfe')\n  }\n}\n// 扩展一个\b事件总线\nconst EventEmitter = require('events');\nclass MyEmitter extends EventEmitter {}\nconst myEmitter = new MyEmitter();\nBigFe.prototype.eventBus = myEmitter\n\nconst app = new Koa()\nconst mfvm = new MicroFe(app)\n\n```","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fweivea%2Fmicro-fe","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fweivea%2Fmicro-fe","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fweivea%2Fmicro-fe/lists"}