webpack-dev-middleware 的 fork 版本,可在 dev 时,将编译结果,保存到配置的 output path 路径中
It's a simple wrapper middleware for webpack. It serves the files emitted from webpack over a connect server. This should be used for development only.
It has a few advantages over bundling it as files:
- No files are written to disk, it handle the files in memory
- If files changed in watch mode, the middleware no longer serves the old bundle, but delays requests until the compiling has finished. You don't have to wait before refreshing the page after a file modification.
- I may add some specific optimization in future releases.
Install
npm install webpack-dev-middleware-hard-disk --save-dev
Usage
var webpackMiddleware = ;app;
Example usage:
app;
Advanced API
This part shows how you might interact with the middleware during runtime:
-
close(callback)
- stop watching for file changesvar webpackDevMiddlewareInstance = ;app;// After 10 seconds stop watching for file changes:; -
invalidate()
- recompile the bundle - e.g. after you changed the configurationvar compiler = ;var webpackDevMiddlewareInstance = ;app;; -
waitUntilValid(callback)
- executes thecallback
if the bundle is valid or after it is valid again:var webpackDevMiddlewareInstance = ;app;webpackDevMiddlewareInstance;
Server-Side Rendering
Note: this feature is experimental and may be removed or changed completely in the future.
In order to develop a server-side rendering application, we need access to the stats
, which is generated with the latest build.
In the server-side rendering mode, webpack-dev-middleware-hard-disk sets the stat
to res.locals.webpackStats
before invoking the next middleware, allowing a developer to render the page body and manage the response to clients.
Notice that requests for bundle files would still be responded by webpack-dev-middleware-hard-disk and all requests will be pending until the building process is finished in the server-side rendering mode.
// This function makes server rendering of asset references consistent with different webpack chunk/entry confiugrations { return Array ? assets : assets} app
Contributing
Don't hesitate to create a pull request. Every contribution is appreciated. In development you can start the tests by calling npm test
.
Maintainers
Kees Kluskens |