{"id":13846256,"url":"https://github.com/easy-team/egg-view-react-ssr","last_synced_at":"2025-04-13T09:32:33.825Z","repository":{"id":57220854,"uuid":"96416240","full_name":"easy-team/egg-view-react-ssr","owner":"easy-team","description":"Egg React Server Side Render (SSR) Plugin","archived":false,"fork":false,"pushed_at":"2020-09-05T08:44:36.000Z","size":142,"stargazers_count":62,"open_issues_count":1,"forks_count":9,"subscribers_count":4,"default_branch":"master","last_synced_at":"2025-03-30T14:01:52.910Z","etag":null,"topics":["egg","egg-plugin","egg-react","egg-view-react","react","react-server-render","render-engine","webpack"],"latest_commit_sha":null,"homepage":"https://easyjs.cn","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/easy-team.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-07-06T10:01:02.000Z","updated_at":"2024-07-17T02:09:03.000Z","dependencies_parsed_at":"2022-08-29T02:12:19.225Z","dependency_job_id":null,"html_url":"https://github.com/easy-team/egg-view-react-ssr","commit_stats":null,"previous_names":["hubcarl/egg-view-react-ssr"],"tags_count":30,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/easy-team%2Fegg-view-react-ssr","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/easy-team%2Fegg-view-react-ssr/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/easy-team%2Fegg-view-react-ssr/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/easy-team%2Fegg-view-react-ssr/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/easy-team","download_url":"https://codeload.github.com/easy-team/egg-view-react-ssr/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248690915,"owners_count":21146231,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","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":["egg","egg-plugin","egg-react","egg-view-react","react","react-server-render","render-engine","webpack"],"created_at":"2024-08-04T18:00:21.231Z","updated_at":"2025-04-13T09:32:33.233Z","avatar_url":"https://github.com/easy-team.png","language":"JavaScript","funding_links":[],"categories":["依赖"],"sub_categories":[],"readme":"# egg-view-react-ssr\n\n[![NPM version][npm-image]][npm-url]\n[![build status][travis-image]][travis-url]\n[![Test coverage][codecov-image]][codecov-url]\n[![David deps][david-image]][david-url]\n[![Known Vulnerabilities][snyk-image]][snyk-url]\n[![npm download][download-image]][download-url]\n\n[npm-image]: https://img.shields.io/npm/v/egg-view-react-ssr.svg?style=flat-square\n[npm-url]: https://npmjs.org/package/egg-view-react-ssr\n[travis-image]: https://img.shields.io/travis/easy-team/egg-view-react-ssr.svg?style=flat-square\n[travis-url]: https://travis-ci.org/easy-team/egg-view-react-ssr\n[codecov-image]: https://img.shields.io/codecov/c/github/easy-team/egg-view-react-ssr.svg?style=flat-square\n[codecov-url]: https://codecov.io/github/easy-team/egg-view-react-ssr?branch=master\n[david-image]: https://img.shields.io/david/easy-team/egg-view-react-ssr.svg?style=flat-square\n[david-url]: https://david-dm.org/easy-team/egg-view-react-ssr\n[snyk-image]: https://snyk.io/test/npm/egg-view-react-ssr/badge.svg?style=flat-square\n[snyk-url]: https://snyk.io/test/npm/egg-view-react-ssr\n[download-image]: https://img.shields.io/npm/dm/egg-view-react-ssr.svg?style=flat-square\n[download-url]: https://npmjs.org/package/egg-view-react-ssr\n\nReact server side render solution for egg\n\n## Install\n\n```bash\n$ npm i egg-view-react-ssr --save\n```\n\n## Usage\n\n```js\n// {app_root}/config/plugin.js\nexports.reactssr = {\n  enable: true,\n  package: 'egg-view-react-ssr',\n};\n```\n\n## Version\n\n#### 3.x.x (Node\u003e8)\n\n- node version \u003e 8\n- config `reactssr.layout` default `app/view/layout.html`\n- support react stateless component render (not support promise function callback)\n\n#### 2.x.x (Node\u003e6)\n\n- node version \u003e 6\n- config `reactssr.layout` default `app/view/layout.js`\n- support promise function callback(not support react stateless component render)\n\n#### 1.x.x\n\negg-view-react-ssr depends on egg-view-react plugin\n\n## Configuration\n\n```js\n// {app_root}/config/config.default.js\nexports.reactssr = {\n  // doctype: '\u003c!doctype html\u003e',\n  // layout: path.join(app.baseDir, 'app/view/layout.html'),\n  // manifest: path.join(app.baseDir, 'config/manifest.json'),\n  // injectHeadRegex: /(\u003c\\/head\u003e)/i,\n  // injectBodyRegex: /(\u003c\\/body\u003e)/i,\n  // injectCss: true,\n  // injectJs: true,\n  // crossorigin: false,\n  // injectRes: [],\n  // mergeLocals: true,\n  // fallbackToClient: true, // fallback to client rendering if server render failed\n  // afterRender: (html, context) =\u003e { /* eslint no-unused-vars:off */\n  //   return html;\n  // },\n};\n```\n\nsee [config/config.default.js](config/config.default.js) for more detail.\n\n\n## Render\n\n### Server Render, Call `render`\n\n\u003e when server render bundle error, will try client render**\n\n\u003e https://www.yuque.com/easy-team/egg-react/node\n\n```js\n// controller/home.js\nmodule.exports = app =\u003e {\n  return class IndecController extends app.Controller {\n    async index(ctx) {\n      // home.js: webpack builded ssr entry jsbundle file\n      await ctx.render('home.js', { message: 'egg react server side render'});\n    }\n  };\n};\n```\n\n### Client Render, Call `renderClient`, Use React render layout\n\n\u003e https://www.yuque.com/easy-team/egg-react/web\n\n\u003e when client render, render layout `exports.reactssr.layout` by React\n\n```js\n// controller/home.js\nmodule.exports = app =\u003e {\n  return class IndecController extends app.Controller {\n    async index(ctx) {\n      // home.js: webpack builded client render entry jsbundle file\n      await ctx.renderClient('home.js', { message: 'egg react client side render'});\n    }\n  };\n};\n```\n\n### Asset Render, Call `renderAsset`, Use render layout by viewEngine, default `nunjucks`\n\n\u003e https://www.yuque.com/easy-team/egg-react/asset\n\n- when asset render, you can render layout `exports.reactssr.layout` by viewEngine, default use `egg-view-nunjucks`\n- you must install the specified engine dependence, such as `egg-view-nunjucks` or `egg-view-ejs`\n- The context provides an `asset` object that can get `js`, `css`, `state` information. [layout template](https://www.yuque.com/easy-team/egg-react/asset)\n\n#### use default viewEngine nunjucks\n\n```js\n// controller/home.js\nmodule.exports = app =\u003e {\n  return class IndecController extends app.Controller {\n    async index(ctx) {\n      // home.js: webpack builded client render entry jsbundle file\n      await ctx.renderAsset('home.js', { message: 'egg react client asset render'});\n    }\n  };\n};\n```\n\n#### scope render viewEngine config\n\n```js\n// controller/home.js\nmodule.exports = app =\u003e {\n  return class IndecController extends app.Controller {\n    async index(ctx) {\n      // home.js: webpack builded client render entry jsbundle file\n      await ctx.renderAsset('home.js', { message: 'egg react client asset render'}, { viewEngine: 'ejs' });\n    }\n  };\n};\n```\n\n## Example\n\n- React Server Side Render [egg-react-webpack-boilerplate](https://github.com/easy-team/egg-react-webpack-boilerplate)\n\n- React TypeScript Server Side Render [egg-react-typescript-boilerplate](https://github.com/easy-team/egg-react-typescript-boilerplate)\n\n- React SSR Framework Example for Egg [res-awesome](https://github.com/easy-team/res-awesome)\n\n## Questions \u0026 Suggestions\n\nPlease open an issue [here](https://github.com/easy-team/egg-react-webpack-boilerplate/issues).\n\n## License\n\n[MIT](LICENSE)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Feasy-team%2Fegg-view-react-ssr","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Feasy-team%2Fegg-view-react-ssr","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Feasy-team%2Fegg-view-react-ssr/lists"}