From 572133a58ddbfa83f3c8802360666e71617e7ea3 Mon Sep 17 00:00:00 2001 From: Damien Arrachequesne Date: Fri, 22 Apr 2022 23:09:24 +0200 Subject: [PATCH] docs(examples): update example with webpack --- examples/webpack-build/README.md | 11 +------ examples/webpack-build/index.html | 5 ++- examples/webpack-build/index.js | 15 +++++++++ examples/webpack-build/lib/index.js | 12 ------- examples/webpack-build/package.json | 15 +++------ examples/webpack-build/support/noop.js | 2 -- .../webpack-build/support/webpack.config.js | 8 ----- .../support/webpack.config.json-parser.js | 33 ------------------- .../support/webpack.config.slim.js | 31 ----------------- examples/webpack-build/webpack.config.js | 7 ++++ 10 files changed, 30 insertions(+), 109 deletions(-) create mode 100644 examples/webpack-build/index.js delete mode 100644 examples/webpack-build/lib/index.js delete mode 100644 examples/webpack-build/support/noop.js delete mode 100644 examples/webpack-build/support/webpack.config.js delete mode 100644 examples/webpack-build/support/webpack.config.json-parser.js delete mode 100644 examples/webpack-build/support/webpack.config.slim.js create mode 100644 examples/webpack-build/webpack.config.js diff --git a/examples/webpack-build/README.md b/examples/webpack-build/README.md index 7df0835a9d..63a4aec619 100644 --- a/examples/webpack-build/README.md +++ b/examples/webpack-build/README.md @@ -7,14 +7,5 @@ A sample Webpack build for the browser. ``` $ npm i -$ npm run build-all +$ npm run build ``` - -There are two WebPack configuration: - -- the minimal configuration, just bundling the application and its dependencies. The `app.js` file in the `dist` folder is the result of that build. - -- a slimmer one, where: - - the JSON polyfill needed for IE6/IE7 support has been removed. - - the `debug` calls and import have been removed (the [debug](https://github.com/visionmedia/debug) library is included in the build by default). - - the source has been uglified (dropping IE8 support), and an associated SourceMap has been generated. diff --git a/examples/webpack-build/index.html b/examples/webpack-build/index.html index 77b3d69606..1c90f49968 100644 --- a/examples/webpack-build/index.html +++ b/examples/webpack-build/index.html @@ -6,8 +6,7 @@ - - + - \ No newline at end of file + diff --git a/examples/webpack-build/index.js b/examples/webpack-build/index.js new file mode 100644 index 0000000000..40294e9586 --- /dev/null +++ b/examples/webpack-build/index.js @@ -0,0 +1,15 @@ +import { io } from "socket.io-client"; + +const socket = io("http://localhost:3000"); + +socket.on("connect", () => { + console.log(`connect ${socket.id}`); +}); + +socket.on("connect_error", (err) => { + console.log(`connect_error due to ${err.message}`); +}); + +socket.on("disconnect", (reason) => { + console.log(`disconnect due to ${reason}`); +}); diff --git a/examples/webpack-build/lib/index.js b/examples/webpack-build/lib/index.js deleted file mode 100644 index b288a0be96..0000000000 --- a/examples/webpack-build/lib/index.js +++ /dev/null @@ -1,12 +0,0 @@ - -import io from 'socket.io-client'; - -const socket = io('http://localhost:3000'); - -console.log('init'); - -socket.on('connect', onConnect); - -function onConnect(){ - console.log('connect ' + socket.id); -} diff --git a/examples/webpack-build/package.json b/examples/webpack-build/package.json index 19fb136177..86290c52d1 100644 --- a/examples/webpack-build/package.json +++ b/examples/webpack-build/package.json @@ -2,20 +2,15 @@ "name": "webpack-build", "version": "1.0.0", "description": "A sample Webpack build", + "type": "module", "scripts": { - "build": "webpack --config ./support/webpack.config.js", - "build-slim": "webpack --config ./support/webpack.config.slim.js", - "build-json-parser": "webpack --config ./support/webpack.config.json-parser.js", - "build-all": "npm run build && npm run build-slim && npm run build-json-parser" + "build": "webpack" }, "author": "Damien Arrachequesne", "license": "MIT", "dependencies": { - "socket.io-client": "^2.0.2", - "socket.io-json-parser": "^2.1.0" - }, - "devDependencies": { - "strip-loader": "^0.1.2", - "webpack": "^2.6.1" + "socket.io-client": "^4.4.1", + "webpack": "^5.72.0", + "webpack-cli": "^4.9.2" } } diff --git a/examples/webpack-build/support/noop.js b/examples/webpack-build/support/noop.js deleted file mode 100644 index 920c02ed2e..0000000000 --- a/examples/webpack-build/support/noop.js +++ /dev/null @@ -1,2 +0,0 @@ - -module.exports = function () { return function () {}; }; diff --git a/examples/webpack-build/support/webpack.config.js b/examples/webpack-build/support/webpack.config.js deleted file mode 100644 index 63de64bcac..0000000000 --- a/examples/webpack-build/support/webpack.config.js +++ /dev/null @@ -1,8 +0,0 @@ - -module.exports = { - entry: './lib/index.js', - output: { - path: require('path').join(__dirname, '../dist'), - filename: 'app.js' - } -}; diff --git a/examples/webpack-build/support/webpack.config.json-parser.js b/examples/webpack-build/support/webpack.config.json-parser.js deleted file mode 100644 index fce52ea70a..0000000000 --- a/examples/webpack-build/support/webpack.config.json-parser.js +++ /dev/null @@ -1,33 +0,0 @@ - -var webpack = require('webpack'); - -module.exports = { - entry: './lib/index.js', - output: { - path: require('path').join(__dirname, '../dist'), - filename: 'app.json-parser.js' - }, - // generate sourcemap - devtool: 'source-map', - plugins: [ - // replace require('debug')() with an noop function - new webpack.NormalModuleReplacementPlugin(/debug/, process.cwd() + '/support/noop.js'), - // replace socket.io-parser with socket.io-json-parser - new webpack.NormalModuleReplacementPlugin(/socket\.io-parser/, 'socket.io-json-parser'), - // use uglifyJS (IE9+ support) - new webpack.optimize.UglifyJsPlugin({ - compress: { - warnings: false - } - }) - ], - module: { - loaders: [ - { - // strip `debug()` calls - test: /\.js$/, - loader: 'strip-loader?strip[]=debug' - } - ] - } -}; diff --git a/examples/webpack-build/support/webpack.config.slim.js b/examples/webpack-build/support/webpack.config.slim.js deleted file mode 100644 index d8b24160df..0000000000 --- a/examples/webpack-build/support/webpack.config.slim.js +++ /dev/null @@ -1,31 +0,0 @@ - -var webpack = require('webpack'); - -module.exports = { - entry: './lib/index.js', - output: { - path: require('path').join(__dirname, '../dist'), - filename: 'app.slim.js' - }, - // generate sourcemap - devtool: 'source-map', - plugins: [ - // replace require('debug')() with an noop function - new webpack.NormalModuleReplacementPlugin(/debug/, process.cwd() + '/support/noop.js'), - // use uglifyJS (IE9+ support) - new webpack.optimize.UglifyJsPlugin({ - compress: { - warnings: false - } - }) - ], - module: { - loaders: [ - { - // strip `debug()` calls - test: /\.js$/, - loader: 'strip-loader?strip[]=debug' - } - ] - } -}; diff --git a/examples/webpack-build/webpack.config.js b/examples/webpack-build/webpack.config.js new file mode 100644 index 0000000000..2db40987a7 --- /dev/null +++ b/examples/webpack-build/webpack.config.js @@ -0,0 +1,7 @@ +export default { + entry: "./index.js", + mode: "production", + output: { + filename: "bundle.js", + }, +};