diff --git a/examples/webpack-build-server/README.md b/examples/webpack-build-server/README.md new file mode 100644 index 0000000000..b71d931193 --- /dev/null +++ b/examples/webpack-build-server/README.md @@ -0,0 +1,18 @@ + +# Socket.IO WebPack build + +A sample Webpack build for the server. + +## How to use + +``` +$ npm i +$ npm run build +$ npm start +``` + +**Note:** + +- the `bufferutil` and `utf-8-validate` are optional dependencies from `ws`, compiled from native code, which are meant to improve performance ([ref](https://github.com/websockets/ws#opt-in-for-performance)). You can also omit them, as they have their JS fallback, and ignore the WebPack warning. + +- the server is initiated with `serveClient` set to `false`, so it will not serve the client file. diff --git a/examples/webpack-build-server/lib/index.js b/examples/webpack-build-server/lib/index.js new file mode 100644 index 0000000000..afcdbdb8a4 --- /dev/null +++ b/examples/webpack-build-server/lib/index.js @@ -0,0 +1,15 @@ + +const server = require('http').createServer(); +const io = require('socket.io')(server, { + // serveClient: false // do not serve the client file, in that case the brfs loader is not needed +}); +const port = process.env.PORT || 3000; + +io.on('connect', onConnect); +server.listen(port, () => console.log('server listening on port ' + port)); + +function onConnect(socket){ + console.log('connect ' + socket.id); + + socket.on('disconnect', () => console.log('disconnect ' + socket.id)); +} diff --git a/examples/webpack-build-server/package.json b/examples/webpack-build-server/package.json new file mode 100644 index 0000000000..28ef8ba392 --- /dev/null +++ b/examples/webpack-build-server/package.json @@ -0,0 +1,23 @@ +{ + "name": "webpack-build-server", + "version": "1.0.0", + "description": "A sample Webpack build (for the server)", + "scripts": { + "start": "node dist/server.js", + "build": "webpack --config ./support/webpack.config.js" + }, + "author": "Damien Arrachequesne", + "license": "MIT", + "dependencies": { + "brfs": "^1.4.3", + "bufferutil": "^1.3.0", + "socket.io": "^1.7.2", + "transform-loader": "^0.2.3", + "utf-8-validate": "^2.0.0" + }, + "devDependencies": { + "json-loader": "^0.5.4", + "null-loader": "^0.1.1", + "webpack": "^1.14.0" + } +} diff --git a/examples/webpack-build-server/support/webpack.config.js b/examples/webpack-build-server/support/webpack.config.js new file mode 100644 index 0000000000..a9893a73d2 --- /dev/null +++ b/examples/webpack-build-server/support/webpack.config.js @@ -0,0 +1,25 @@ + +module.exports = { + entry: './lib/index.js', + target: 'node', + output: { + path: './dist', + filename: 'server.js' + }, + module: { + loaders: [ + { + test: /(\.md|\.map)$/, + loader: 'null' + }, + { + test: /\.json$/, + loader: 'json' + }, + { + test: /\.js$/, + loader: "transform-loader?brfs" + } + ] + } +}; diff --git a/examples/webpack-build/README.md b/examples/webpack-build/README.md new file mode 100644 index 0000000000..7df0835a9d --- /dev/null +++ b/examples/webpack-build/README.md @@ -0,0 +1,20 @@ + +# Socket.IO WebPack build + +A sample Webpack build for the browser. + +## How to use + +``` +$ npm i +$ npm run build-all +``` + +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 new file mode 100644 index 0000000000..77b3d69606 --- /dev/null +++ b/examples/webpack-build/index.html @@ -0,0 +1,13 @@ + + + + + Socket.IO WebPack Example + + + + + + + + \ No newline at end of file diff --git a/examples/webpack-build/lib/index.js b/examples/webpack-build/lib/index.js new file mode 100644 index 0000000000..82af605bf3 --- /dev/null +++ b/examples/webpack-build/lib/index.js @@ -0,0 +1,10 @@ + +var socket = require('socket.io-client')('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 new file mode 100644 index 0000000000..0c04d0b546 --- /dev/null +++ b/examples/webpack-build/package.json @@ -0,0 +1,19 @@ +{ + "name": "webpack-build", + "version": "1.0.0", + "description": "A sample Webpack build", + "scripts": { + "build": "webpack --config ./support/webpack.config.js", + "build-slim": "webpack --config ./support/webpack.config.slim.js", + "build-all": "npm run build && npm run build-slim" + }, + "author": "Damien Arrachequesne", + "license": "MIT", + "dependencies": { + "socket.io-client": "^1.7.2" + }, + "devDependencies": { + "strip-loader": "^0.1.2", + "webpack": "^1.14.0" + } +} diff --git a/examples/webpack-build/support/noop.js b/examples/webpack-build/support/noop.js new file mode 100644 index 0000000000..920c02ed2e --- /dev/null +++ b/examples/webpack-build/support/noop.js @@ -0,0 +1,2 @@ + +module.exports = function () { return function () {}; }; diff --git a/examples/webpack-build/support/webpack.config.js b/examples/webpack-build/support/webpack.config.js new file mode 100644 index 0000000000..8b5bd4b7cd --- /dev/null +++ b/examples/webpack-build/support/webpack.config.js @@ -0,0 +1,8 @@ + +module.exports = { + entry: './lib/index.js', + output: { + path: './dist', + filename: 'app.js' + }, +}; diff --git a/examples/webpack-build/support/webpack.config.slim.js b/examples/webpack-build/support/webpack.config.slim.js new file mode 100644 index 0000000000..cc2a38fc98 --- /dev/null +++ b/examples/webpack-build/support/webpack.config.slim.js @@ -0,0 +1,35 @@ + +var webpack = require('webpack'); + +module.exports = { + entry: './lib/index.js', + output: { + path: './dist', + filename: 'app.slim.js' + }, + externals: { + // replace JSON polyfill (IE6/IE7) with global JSON object + json3: 'JSON' + }, + // 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' + } + ] + } +};