{"id":13475044,"url":"https://github.com/shellscape/koa-webpack","last_synced_at":"2025-04-11T19:13:56.259Z","repository":{"id":12269213,"uuid":"71396770","full_name":"shellscape/koa-webpack","owner":"shellscape","description":"Development and Hot Reload Middleware for Koa2","archived":false,"fork":false,"pushed_at":"2024-09-17T09:25:17.000Z","size":951,"stargazers_count":440,"open_issues_count":3,"forks_count":53,"subscribers_count":11,"default_branch":"master","last_synced_at":"2025-04-11T19:13:51.664Z","etag":null,"topics":["composer","koa2","middleware","webpack","webpack-dev-middleware","webpack-hot-middleware","webpack2"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mpl-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/shellscape.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":".github/CONTRIBUTING.md","funding":".github/funding.yml","license":"LICENSE","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},"funding":{"patreon":"shellscape","custom":"https://paypal.me/shellscape","liberapay":"shellscape"}},"created_at":"2016-10-19T20:31:41.000Z","updated_at":"2025-03-03T15:17:07.000Z","dependencies_parsed_at":"2024-06-18T12:25:48.793Z","dependency_job_id":"116e7a08-2673-4740-ae09-95743c851720","html_url":"https://github.com/shellscape/koa-webpack","commit_stats":{"total_commits":144,"total_committers":23,"mean_commits":6.260869565217392,"dds":0.3819444444444444,"last_synced_commit":"294005e6f209db06f11b4a8f71889a7a5f5ae2eb"},"previous_names":[],"tags_count":31,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shellscape%2Fkoa-webpack","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shellscape%2Fkoa-webpack/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shellscape%2Fkoa-webpack/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shellscape%2Fkoa-webpack/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/shellscape","download_url":"https://codeload.github.com/shellscape/koa-webpack/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248465344,"owners_count":21108244,"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":["composer","koa2","middleware","webpack","webpack-dev-middleware","webpack-hot-middleware","webpack2"],"created_at":"2024-07-31T16:01:16.927Z","updated_at":"2025-04-11T19:13:56.222Z","avatar_url":"https://github.com/shellscape.png","language":"JavaScript","readme":"[tests]: \thttps://img.shields.io/circleci/project/github/shellscape/koa-webpack.svg\n[tests-url]: https://circleci.com/gh/shellscape/koa-webpack\n\n[cover]: https://codecov.io/gh/shellscape/koa-webpack/branch/master/graph/badge.svg\n[cover-url]: https://codecov.io/gh/shellscape/koa-webpack\n\n[size]: https://packagephobia.now.sh/badge?p=koa-webpack\n[size-url]: https://packagephobia.now.sh/result?p=koa-webpack\n\n# koa-webpack\n\n[![tests][tests]][tests-url]\n[![cover][cover]][cover-url]\n[![size][size]][size-url]\n\nDevelopment and Hot Module Reload Middleware for **Koa2**, in a single\nmiddleware module.\n\nThis module wraps and composes\n[`webpack-dev-middleware`](https://github.com/webpack/webpack-dev-middleware) and\n[`webpack-hot-client`](https://github.com/shellscape/webpack-hot-client)\ninto a single middleware module, allowing for quick and concise implementation.\n\nAs an added bonus, it'll also use the installed `webpack` module from your project,\nand the `webpack.config.js` file in the root of your project, automagically, should\nyou choose to let it. This negates the need for all of the repetitive setup and\nconfig that you get with `koa-webpack-middleware`.\n\n## Install\n\nUsing npm:\n\n```console\nnpm install koa-webpack --save-dev\n```\n\n\u003ca href=\"https://www.patreon.com/shellscape\"\u003e\n  \u003cimg src=\"https://c5.patreon.com/external/logo/become_a_patron_button@2x.png\" width=\"160\"\u003e\n\u003c/a\u003e\n\n## Requirements\n\n`koa-webpack` is an evergreen module. 🌲 This module requires an [Active LTS](https://github.com/nodejs/Release) Node version (v8.0.0+ or v10.0.0+), and Webpack v4.0.0+.\n\n## Usage\n\n```js\nconst Koa = require('koa');\nconst koaWebpack = require('koa-webpack');\n\nconst app = new Koa();\nconst options = { .. };\nconst middleware = await koaWebpack(options);\n\napp.use(middleware);\n```\n\n## API\n\n### koaWebpack([options])\n\nReturns a `Promise` which resolves the server `middleware` containing the\nfollowing additional properties:\n\n- `close(callback)` *(Function)* - Closes both the instance of `webpack-dev-middleware`\nand `webpack-hot-client`. Accepts a single `Function` callback parameter that is\nexecuted when complete.\n- `hotClient` *(Object)* - An instance of `webpack-hot-client`.\n- `devMiddleware` *(Object)* - An instance of `webpack-dev-middleware`\n\n## Options\n\nThe middleware accepts an `options` Object, which can contain options for the\n`webpack-dev-middleware` and `webpack-hot-client` bundled with this module.\nThe following is a property reference for the Object:\n\n### compiler\n\nType: `Object`  \n`optional`\n\nShould you rather that the middleware use an instance of `webpack` that you've\nalready init'd [with webpack config], you can pass it to the middleware using\nthis option.\n\nExample:\n\n```js\nconst webpack = require('webpack');\nconst config = require('./webpack.config.js');\nconst koaWebpack = require('koa-webpack');\n\nconst compiler = webpack(config);\nconst middleware = await koaWebpack({ compiler });\n\napp.use(middleware);\n```\n\n### config\n\nType: `Object`\n\nShould you rather that the middleware use an instance of webpack configuration\nthat you've already required/imported, you can pass it to the middleware using\nthis option.\n\nExample:\n\n```js\nconst koaWebpack = require('koa-webpack');\nconst config = require('./webpack.config.js');\n\nconst middleware = await koaWebpack({ config });\n\napp.use(middleware);\n```\n\n### configPath\n\nType: `String`\n\nAllows you to specify the absolute path to the Webpack config file to be used.\n\nExample:\n\n```js\nconst path = require('path');\nconst koaWebpack = require('koa-webpack');\n\n// The Webpack config file would be at \"./client/webpack.config.js\".\nconst middleware = await koaWebpack({\n  configPath: path.join(__dirname, 'client', 'webpack.config.js')\n});\n\napp.use(middleware);\n```\n\n### devMiddleware\n\nType: `Object`\n\nThe `devMiddleware` property should contain options for `webpack-dev-middleware`, a list of\nwhich is available at [webpack-dev-middleware](https://github.com/webpack/webpack-dev-middleware).\nOmitting this property will result in `webpack-dev-middleware` using its default\noptions.\n\n### hotClient\n\nType: `Object|Boolean`\n\nThe `hotClient` property should contain options for `webpack-hot-client`, a list of\nwhich is available at [webpack-hot-client](https://github.com/webpack-contrib/webpack-hot-client).\nOmitting this property will result in `webpack-hot-client` using its default\noptions.\n\nAs of `v3.0.1` setting this to `false` will completely disable `webpack-hot-client`\nand all automatic Hot Module Replacement functionality.\n\n## Using with koa-compress\n\nWhen using `koa-webpack` with [koa-compress](https://github.com/koajs/compress),\nyou may experience issues with saving files and hot module reload. Please review\n[this issue](https://github.com/shellscape/koa-webpack/issues/36#issuecomment-289565573)\nfor more information and a workaround.\n\n## Server-Side-Rendering\n\nWhen `serverSideRender` is set to true in `config.devMiddleware`, `webpackStats` is\naccessible from `ctx.state.webpackStats`.\n\n```js\napp.use(async (ctx, next) =\u003e {\n  const assetsByChunkName = ctx.state.webpackStats.toJson().assetsByChunkName;\n  // do something with assetsByChunkName\n})\n```\n\nFor more details please refer to:\n[webpack-dev-middleware](https://github.com/webpack/webpack-dev-middleware#server-side-rendering)\n\n\n## Using with html-webpack-plugin\n\nWhen using with html-webpack-plugin, you can access dev-middleware in-memory filesystem to serve index.html file:\n\n```js\nconst middleware = await koaWebpack({ config });\n\napp.use(middleware);\n\napp.use(async (ctx) =\u003e {\n  const filename = path.resolve(webpackConfig.output.path, 'index.html')\n  ctx.response.type = 'html'\n  ctx.response.body = middleware.devMiddleware.fileSystem.createReadStream(filename)\n});\n```\n\n## Contributing\n\nPlease take a moment to read our contributing guidelines if you haven't yet done so.\n\n#### [CONTRIBUTING](./.github/CONTRIBUTING.md)\n\n## Attribution\n\nThis module started as a fork of\n[`koa-webpack-middleware`](https://github.com/leecade/koa-webpack-middleware)\n\n## License\n\n#### [MPL](./LICENSE)\n","funding_links":["https://patreon.com/shellscape","https://paypal.me/shellscape","https://liberapay.com/shellscape","https://www.patreon.com/shellscape"],"categories":["JavaScript"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fshellscape%2Fkoa-webpack","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fshellscape%2Fkoa-webpack","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fshellscape%2Fkoa-webpack/lists"}