webpack-dev-service 0.1.1 → 0.1.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -11,12 +11,35 @@
11
11
  ### Usage
12
12
 
13
13
  ```js
14
+ /**
15
+ * @module webpack
16
+ * @description Webpack config
17
+ */
18
+
14
19
  import Koa from 'koa';
15
20
  import path from 'path';
16
21
  import memfs from 'memfs';
17
22
  import webpack from 'webpack';
18
- import koaCompress from 'koa-compress';
19
- import devMiddleware from 'webpack-dev-service';
23
+ import dev from 'webpack-dev-service';
24
+ import HtmlWebpackPlugin from 'html-webpack-plugin';
25
+ import MiniCssExtractPlugin from 'mini-css-extract-plugin';
26
+
27
+ const progress = {
28
+ percentBy: 'entries'
29
+ };
30
+
31
+ const entryHTML = path.resolve('public/index.html');
32
+
33
+ const html = {
34
+ xhtml: true,
35
+ minify: false,
36
+ title: 'React',
37
+ filename: entryHTML,
38
+ templateParameters: { lang: 'en' },
39
+ template: path.resolve('index.ejs'),
40
+ favicon: path.resolve('src/logo.svg'),
41
+ meta: { 'theme-color': '#4285f4', viewport: 'width=device-width,initial-scale=1.0' }
42
+ };
20
43
 
21
44
  function createMemfs() {
22
45
  const volume = new memfs.Volume();
@@ -31,12 +54,118 @@ function httpError(error) {
31
54
  return /^(EOF|EPIPE|ECANCELED|ECONNRESET|ECONNABORTED)$/i.test(error.code);
32
55
  }
33
56
 
34
- const app = new Koa();
35
- const fs = createMemfs();
36
57
  const compiler = webpack({
37
- // Your webpack config
58
+ name: 'react',
59
+ mode: 'development',
60
+ context: path.resolve('src'),
61
+ entry: [
62
+ // Entry file
63
+ path.resolve('src/index.jsx'),
64
+ // Hot client
65
+ 'webpack-dev-service/client'
66
+ ],
67
+ output: {
68
+ publicPath: '/public/',
69
+ filename: `js/[name].js`,
70
+ hashFunction: 'xxhash64',
71
+ path: path.resolve('public'),
72
+ chunkFilename: `js/[name].js`,
73
+ assetModuleFilename: `[path][name][ext]`
74
+ },
75
+ devtool: 'eval-cheap-module-source-map',
76
+ resolve: {
77
+ fallback: { url: false },
78
+ extensions: ['.js', '.jsx']
79
+ },
80
+ watchOptions: {
81
+ aggregateTimeout: 256
82
+ },
83
+ stats: {
84
+ colors: true,
85
+ chunks: false,
86
+ children: false,
87
+ entrypoints: false,
88
+ runtimeModules: false,
89
+ dependentModules: false
90
+ },
91
+ module: {
92
+ strictExportPresence: true,
93
+ rules: [
94
+ {
95
+ oneOf: [
96
+ {
97
+ test: /\.jsx?$/i,
98
+ exclude: /[\\/]node_modules[\\/]/,
99
+ use: [
100
+ {
101
+ loader: 'swc-loader',
102
+ options: {
103
+ swcrc: false,
104
+ jsc: {
105
+ parser: {
106
+ tsx: true,
107
+ syntax: 'typescript'
108
+ },
109
+ transform: {
110
+ react: {
111
+ runtime: 'automatic'
112
+ }
113
+ },
114
+ externalHelpers: true
115
+ },
116
+ env: {
117
+ targets: ['defaults', 'not IE >= 0']
118
+ }
119
+ }
120
+ }
121
+ ]
122
+ },
123
+ {
124
+ test: /\.css$/i,
125
+ exclude: /[\\/]node_modules[\\/]/,
126
+ use: [
127
+ {
128
+ loader: MiniCssExtractPlugin.loader
129
+ },
130
+ {
131
+ loader: 'css-loader',
132
+ options: {
133
+ esModule: true,
134
+ modules: {
135
+ auto: true,
136
+ localIdentName: '[local]-[hash:8]',
137
+ exportLocalsConvention: 'camelCaseOnly'
138
+ }
139
+ }
140
+ }
141
+ ]
142
+ },
143
+ {
144
+ test: /\.svg$/i,
145
+ type: 'asset/resource',
146
+ exclude: /[\\/]node_modules[\\/]/
147
+ }
148
+ ]
149
+ }
150
+ ]
151
+ },
152
+ plugins: [
153
+ new webpack.ProgressPlugin(progress),
154
+ new HtmlWebpackPlugin(html),
155
+ new MiniCssExtractPlugin({
156
+ ignoreOrder: true,
157
+ filename: 'css/[name].css',
158
+ chunkFilename: 'css/[name].css'
159
+ })
160
+ ]
38
161
  });
39
162
 
163
+ const port = 8000;
164
+ const app = new Koa();
165
+ const fs = createMemfs();
166
+ const server = dev(compiler, { index: false, outputFileSystem: fs });
167
+ const logger = compiler.getInfrastructureLogger('webpack-dev-middleware');
168
+
40
169
  app.use(async (ctx, next) => {
41
170
  ctx.set({
42
171
  'Cache-Control': 'no-store',
@@ -50,29 +179,20 @@ app.use(async (ctx, next) => {
50
179
  await next();
51
180
  });
52
181
 
53
- app.use(koaCompress({ br: false }));
54
-
55
- const devServer = devMiddleware(compiler, {
56
- index: false,
57
- outputFileSystem: fs
58
- });
59
-
60
- app.use(devServer);
182
+ app.use(server);
61
183
 
62
184
  app.use(async ctx => {
63
185
  ctx.type = 'text/html; charset=utf-8';
64
- ctx.body = fs.createReadStream('index.html');
186
+ ctx.body = fs.createReadStream(entryHTML);
65
187
  });
66
188
 
67
189
  app.on('error', error => {
68
190
  !httpError(error) && console.error(error);
69
191
  });
70
192
 
71
- app.listen(8000, () => {
72
- devServer.waitUntilValid(() => {
73
- const { logger } = devServer.context;
74
-
75
- logger.info(`server run at: \u001B[36mhttp://127.0.0.1:8000\u001B[0m`);
193
+ app.listen(port, () => {
194
+ server.waitUntilValid(() => {
195
+ logger.info(`server run at: \u001B[36mhttp://127.0.0.1:${port}\u001B[0m`);
76
196
  });
77
197
  });
78
198
  ```
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @package webpack-dev-service
3
3
  * @license MIT
4
- * @version 0.1.1
4
+ * @version 0.1.3
5
5
  * @author nuintun <nuintun@qq.com>
6
6
  * @description A koa 2 middleware for webpack development and hot reloading.
7
7
  * @see https://github.com/nuintun/webpack-dev-service#readme
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @package webpack-dev-service
3
3
  * @license MIT
4
- * @version 0.1.1
4
+ * @version 0.1.3
5
5
  * @author nuintun <nuintun@qq.com>
6
6
  * @description A koa 2 middleware for webpack development and hot reloading.
7
7
  * @see https://github.com/nuintun/webpack-dev-service#readme
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @package webpack-dev-service
3
3
  * @license MIT
4
- * @version 0.1.1
4
+ * @version 0.1.3
5
5
  * @author nuintun <nuintun@qq.com>
6
6
  * @description A koa 2 middleware for webpack development and hot reloading.
7
7
  * @see https://github.com/nuintun/webpack-dev-service#readme
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @package webpack-dev-service
3
3
  * @license MIT
4
- * @version 0.1.1
4
+ * @version 0.1.3
5
5
  * @author nuintun <nuintun@qq.com>
6
6
  * @description A koa 2 middleware for webpack development and hot reloading.
7
7
  * @see https://github.com/nuintun/webpack-dev-service#readme
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @package webpack-dev-service
3
3
  * @license MIT
4
- * @version 0.1.1
4
+ * @version 0.1.3
5
5
  * @author nuintun <nuintun@qq.com>
6
6
  * @description A koa 2 middleware for webpack development and hot reloading.
7
7
  * @see https://github.com/nuintun/webpack-dev-service#readme
@@ -42,10 +42,21 @@ const resolveHost = params => {
42
42
  const resolveOptions = () => {
43
43
  const params = new URLSearchParams(__resourceQuery);
44
44
  const host = resolveHost(params);
45
+ const hmr = params.get('hmr') !== 'false';
45
46
  const live = params.get('live') !== 'false';
46
47
  const overlay = params.get('overlay') !== 'false';
48
+ const progress = params.get('progress') !== 'false';
47
49
  try {
48
- return { ...__WDS_HOT_OPTIONS__, host, live, overlay };
50
+ const options = __WDS_HOT_OPTIONS__;
51
+ return {
52
+ host,
53
+ live,
54
+ overlay,
55
+ name: options.name,
56
+ path: options.path,
57
+ hmr: options.hmr === false ? false : hmr,
58
+ progress: options.progress === false ? false : progress
59
+ };
49
60
  } catch {
50
61
  throw new Error('Imported the hot client but the hot server is not enabled.');
51
62
  }
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @package webpack-dev-service
3
3
  * @license MIT
4
- * @version 0.1.1
4
+ * @version 0.1.3
5
5
  * @author nuintun <nuintun@qq.com>
6
6
  * @description A koa 2 middleware for webpack development and hot reloading.
7
7
  * @see https://github.com/nuintun/webpack-dev-service#readme
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @package webpack-dev-service
3
3
  * @license MIT
4
- * @version 0.1.1
4
+ * @version 0.1.3
5
5
  * @author nuintun <nuintun@qq.com>
6
6
  * @description A koa 2 middleware for webpack development and hot reloading.
7
7
  * @see https://github.com/nuintun/webpack-dev-service#readme
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @package webpack-dev-service
3
3
  * @license MIT
4
- * @version 0.1.1
4
+ * @version 0.1.3
5
5
  * @author nuintun <nuintun@qq.com>
6
6
  * @description A koa 2 middleware for webpack development and hot reloading.
7
7
  * @see https://github.com/nuintun/webpack-dev-service#readme
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @package webpack-dev-service
3
3
  * @license MIT
4
- * @version 0.1.1
4
+ * @version 0.1.3
5
5
  * @author nuintun <nuintun@qq.com>
6
6
  * @description A koa 2 middleware for webpack development and hot reloading.
7
7
  * @see https://github.com/nuintun/webpack-dev-service#readme
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @package webpack-dev-service
3
3
  * @license MIT
4
- * @version 0.1.1
4
+ * @version 0.1.3
5
5
  * @author nuintun <nuintun@qq.com>
6
6
  * @description A koa 2 middleware for webpack development and hot reloading.
7
7
  * @see https://github.com/nuintun/webpack-dev-service#readme
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @package webpack-dev-service
3
3
  * @license MIT
4
- * @version 0.1.1
4
+ * @version 0.1.3
5
5
  * @author nuintun <nuintun@qq.com>
6
6
  * @description A koa 2 middleware for webpack development and hot reloading.
7
7
  * @see https://github.com/nuintun/webpack-dev-service#readme
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @package webpack-dev-service
3
3
  * @license MIT
4
- * @version 0.1.1
4
+ * @version 0.1.3
5
5
  * @author nuintun <nuintun@qq.com>
6
6
  * @description A koa 2 middleware for webpack development and hot reloading.
7
7
  * @see https://github.com/nuintun/webpack-dev-service#readme
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @package webpack-dev-service
3
3
  * @license MIT
4
- * @version 0.1.1
4
+ * @version 0.1.3
5
5
  * @author nuintun <nuintun@qq.com>
6
6
  * @description A koa 2 middleware for webpack development and hot reloading.
7
7
  * @see https://github.com/nuintun/webpack-dev-service#readme
package/client/esm/hot.js CHANGED
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @package webpack-dev-service
3
3
  * @license MIT
4
- * @version 0.1.1
4
+ * @version 0.1.3
5
5
  * @author nuintun <nuintun@qq.com>
6
6
  * @description A koa 2 middleware for webpack development and hot reloading.
7
7
  * @see https://github.com/nuintun/webpack-dev-service#readme
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @package webpack-dev-service
3
3
  * @license MIT
4
- * @version 0.1.1
4
+ * @version 0.1.3
5
5
  * @author nuintun <nuintun@qq.com>
6
6
  * @description A koa 2 middleware for webpack development and hot reloading.
7
7
  * @see https://github.com/nuintun/webpack-dev-service#readme
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @package webpack-dev-service
3
3
  * @license MIT
4
- * @version 0.1.1
4
+ * @version 0.1.3
5
5
  * @author nuintun <nuintun@qq.com>
6
6
  * @description A koa 2 middleware for webpack development and hot reloading.
7
7
  * @see https://github.com/nuintun/webpack-dev-service#readme
@@ -40,10 +40,21 @@ const resolveHost = params => {
40
40
  const resolveOptions = () => {
41
41
  const params = new URLSearchParams(__resourceQuery);
42
42
  const host = resolveHost(params);
43
+ const hmr = params.get('hmr') !== 'false';
43
44
  const live = params.get('live') !== 'false';
44
45
  const overlay = params.get('overlay') !== 'false';
46
+ const progress = params.get('progress') !== 'false';
45
47
  try {
46
- return { ...__WDS_HOT_OPTIONS__, host, live, overlay };
48
+ const options = __WDS_HOT_OPTIONS__;
49
+ return {
50
+ host,
51
+ live,
52
+ overlay,
53
+ name: options.name,
54
+ path: options.path,
55
+ hmr: options.hmr === false ? false : hmr,
56
+ progress: options.progress === false ? false : progress
57
+ };
47
58
  } catch {
48
59
  throw new Error('Imported the hot client but the hot server is not enabled.');
49
60
  }
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @package webpack-dev-service
3
3
  * @license MIT
4
- * @version 0.1.1
4
+ * @version 0.1.3
5
5
  * @author nuintun <nuintun@qq.com>
6
6
  * @description A koa 2 middleware for webpack development and hot reloading.
7
7
  * @see https://github.com/nuintun/webpack-dev-service#readme
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @package webpack-dev-service
3
3
  * @license MIT
4
- * @version 0.1.1
4
+ * @version 0.1.3
5
5
  * @author nuintun <nuintun@qq.com>
6
6
  * @description A koa 2 middleware for webpack development and hot reloading.
7
7
  * @see https://github.com/nuintun/webpack-dev-service#readme
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @package webpack-dev-service
3
3
  * @license MIT
4
- * @version 0.1.1
4
+ * @version 0.1.3
5
5
  * @author nuintun <nuintun@qq.com>
6
6
  * @description A koa 2 middleware for webpack development and hot reloading.
7
7
  * @see https://github.com/nuintun/webpack-dev-service#readme
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @package webpack-dev-service
3
3
  * @license MIT
4
- * @version 0.1.1
4
+ * @version 0.1.3
5
5
  * @author nuintun <nuintun@qq.com>
6
6
  * @description A koa 2 middleware for webpack development and hot reloading.
7
7
  * @see https://github.com/nuintun/webpack-dev-service#readme
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @package webpack-dev-service
3
3
  * @license MIT
4
- * @version 0.1.1
4
+ * @version 0.1.3
5
5
  * @author nuintun <nuintun@qq.com>
6
6
  * @description A koa 2 middleware for webpack development and hot reloading.
7
7
  * @see https://github.com/nuintun/webpack-dev-service#readme
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @package webpack-dev-service
3
3
  * @license MIT
4
- * @version 0.1.1
4
+ * @version 0.1.3
5
5
  * @author nuintun <nuintun@qq.com>
6
6
  * @description A koa 2 middleware for webpack development and hot reloading.
7
7
  * @see https://github.com/nuintun/webpack-dev-service#readme
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "webpack-dev-service",
3
- "version": "0.1.1",
3
+ "version": "0.1.3",
4
4
  "description": "A koa 2 middleware for webpack development and hot reloading.",
5
5
  "type": "module",
6
6
  "sideEffects": [
@@ -22,8 +22,8 @@
22
22
  "types": "./types/client/main.d.ts"
23
23
  },
24
24
  "./client?*": {
25
- "import": "./client/esm/main.js",
26
- "require": "./client/cjs/main.cjs",
25
+ "import": "./client/esm/main.js?*",
26
+ "require": "./client/cjs/main.cjs?*",
27
27
  "types": "./types/client/main.d.ts"
28
28
  },
29
29
  "./events": {
@@ -90,15 +90,15 @@
90
90
  "@types/ws": "^8.5.4",
91
91
  "koa-compose": "^4.1.0",
92
92
  "tslib": "^2.5.0",
93
- "webpack-dev-middleware": "^6.1.0",
93
+ "webpack-dev-middleware": "^6.1.1",
94
94
  "ws": "^8.13.0"
95
95
  },
96
96
  "devDependencies": {
97
- "@rollup/plugin-typescript": "^11.1.0",
98
- "@swc/core": "^1.3.57",
97
+ "@rollup/plugin-typescript": "^11.1.1",
98
+ "@swc/core": "^1.3.58",
99
99
  "@swc/helpers": "^0.5.1",
100
100
  "@types/koa-compose": "^3.2.5",
101
- "@types/node": "^20.1.3",
101
+ "@types/node": "^20.1.7",
102
102
  "css-loader": "^6.7.3",
103
103
  "html-webpack-plugin": "^5.5.1",
104
104
  "koa": "^2.14.2",
@@ -109,7 +109,7 @@
109
109
  "react": "^18.2.0",
110
110
  "react-dom": "^18.2.0",
111
111
  "rimraf": "^5.0.0",
112
- "rollup": "^3.21.6",
112
+ "rollup": "^3.21.8",
113
113
  "swc-loader": "^0.2.3",
114
114
  "typescript": "^5.0.4",
115
115
  "webpack": "^5.82.1"
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @package webpack-dev-service
3
3
  * @license MIT
4
- * @version 0.1.1
4
+ * @version 0.1.3
5
5
  * @author nuintun <nuintun@qq.com>
6
6
  * @description A koa 2 middleware for webpack development and hot reloading.
7
7
  * @see https://github.com/nuintun/webpack-dev-service#readme
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @package webpack-dev-service
3
3
  * @license MIT
4
- * @version 0.1.1
4
+ * @version 0.1.3
5
5
  * @author nuintun <nuintun@qq.com>
6
6
  * @description A koa 2 middleware for webpack development and hot reloading.
7
7
  * @see https://github.com/nuintun/webpack-dev-service#readme
@@ -93,9 +93,6 @@ class HotServer {
93
93
  this.options = resolveOptions(options);
94
94
  this.logger = compiler.getInfrastructureLogger(this.name);
95
95
  this.server = new WebSocket.WebSocketServer({ path: this.options.path, noServer: true });
96
- this.setup();
97
- }
98
- setup() {
99
96
  this.setupWss();
100
97
  this.setupHooks();
101
98
  this.setupPlugins();
@@ -129,7 +126,10 @@ class HotServer {
129
126
  const plugins = [
130
127
  new webpack__default.default.NoEmitOnErrorsPlugin(),
131
128
  new webpack__default.default.DefinePlugin({
132
- __WDS_HOT_OPTIONS__: JSON.stringify({ ...options, name: compiler.name })
129
+ __WDS_HOT_OPTIONS__: JSON.stringify({
130
+ ...options,
131
+ name: compiler.name
132
+ })
133
133
  })
134
134
  ];
135
135
  if (options.hmr) {
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @package webpack-dev-service
3
3
  * @license MIT
4
- * @version 0.1.1
4
+ * @version 0.1.3
5
5
  * @author nuintun <nuintun@qq.com>
6
6
  * @description A koa 2 middleware for webpack development and hot reloading.
7
7
  * @see https://github.com/nuintun/webpack-dev-service#readme
package/server/esm/dev.js CHANGED
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @package webpack-dev-service
3
3
  * @license MIT
4
- * @version 0.1.1
4
+ * @version 0.1.3
5
5
  * @author nuintun <nuintun@qq.com>
6
6
  * @description A koa 2 middleware for webpack development and hot reloading.
7
7
  * @see https://github.com/nuintun/webpack-dev-service#readme
package/server/esm/hot.js CHANGED
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @package webpack-dev-service
3
3
  * @license MIT
4
- * @version 0.1.1
4
+ * @version 0.1.3
5
5
  * @author nuintun <nuintun@qq.com>
6
6
  * @description A koa 2 middleware for webpack development and hot reloading.
7
7
  * @see https://github.com/nuintun/webpack-dev-service#readme
@@ -84,9 +84,6 @@ class HotServer {
84
84
  this.options = resolveOptions(options);
85
85
  this.logger = compiler.getInfrastructureLogger(this.name);
86
86
  this.server = new WebSocketServer({ path: this.options.path, noServer: true });
87
- this.setup();
88
- }
89
- setup() {
90
87
  this.setupWss();
91
88
  this.setupHooks();
92
89
  this.setupPlugins();
@@ -120,7 +117,10 @@ class HotServer {
120
117
  const plugins = [
121
118
  new webpack.NoEmitOnErrorsPlugin(),
122
119
  new webpack.DefinePlugin({
123
- __WDS_HOT_OPTIONS__: JSON.stringify({ ...options, name: compiler.name })
120
+ __WDS_HOT_OPTIONS__: JSON.stringify({
121
+ ...options,
122
+ name: compiler.name
123
+ })
124
124
  })
125
125
  ];
126
126
  if (options.hmr) {
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @package webpack-dev-service
3
3
  * @license MIT
4
- * @version 0.1.1
4
+ * @version 0.1.3
5
5
  * @author nuintun <nuintun@qq.com>
6
6
  * @description A koa 2 middleware for webpack development and hot reloading.
7
7
  * @see https://github.com/nuintun/webpack-dev-service#readme