Problem with Webpack trying to bind socket.io

Question

I am trying to create a webpack package containing socket.io

package.json

{ "name": "socketio-webpack", "version": "1.0.0", "description": "", "license": "ISC", "dependencies": { "socket.io": "1.4.4" }, "devDependencies": { "babel-core": "6.4.0", "babel-loader": "6.2.1", "babel-preset-es2015": "6.3.13", "socket.io": "1.4.4", "webpack": "1.12.11" } } 

webpack.config.js

 var path = require('path'); module.exports = { entry: "./src/entry.js", output: { path: __dirname, filename: "bundle.js" }, module: { loaders: [ { test: /\.js?/, include: path.resolve(__dirname, 'src'), loaders: [ 'babel?presets[]=es2015', ] } ] } }; 

SIC / entry.js

 import Server from 'socket.io'; 

Running webpack gives the following warnings and errors:

 Hash: 0bfb3971f31b27c6c1fb Version: webpack 1.12.11 Time: 2106ms Asset Size Chunks Chunk Names bundle.js 1.21 MB 0 [emitted] main + 170 hidden modules WARNING in ./~/socket.io-client/socket.io.js Critical dependencies: 1:475-482 This seems to be a pre-built javascript file. Though this is possible, it not recommended. Try to require the original source to get better results. @ ./~/socket.io-client/socket.io.js 1:475-482 WARNING in ./~/ws/lib/Validation.js Module not found: Error: Cannot resolve module 'utf-8-validate' in D:\temp\socketio-webpack\node_modules\ws\lib @ ./~/ws/lib/Validation.js 10:19-44 WARNING in ./~/ws/lib/BufferUtil.js Module not found: Error: Cannot resolve module 'bufferutil' in D:\temp\socketio-webpack\node_modules\ws\lib @ ./~/ws/lib/BufferUtil.js 10:19-40 ERROR in ./~/socket.io/lib/index.js Module not found: Error: Cannot resolve module 'fs' in D:\temp\socketio-webpack\node_modules\socket.io\lib @ ./~/socket.io/lib/index.js 7:11-24 ERROR in ./~/socket.io-client/package.json Module parse failed: D:\temp\socketio-webpack\node_modules\socket.io-client\package.json Line 2: Unexpected token : You may need an appropriate loader to handle this file type. | { | "_args": [ | [ | " socket.io-client@1.4.4 ", @ ./~/socket.io/lib/index.js 11:20-55 ERROR in ./~/engine.io/lib/server.js Module not found: Error: Cannot resolve module 'fs' in D:\temp\socketio-webpack\node_modules\engine.io\lib @ ./~/engine.io/lib/server.js 8:19-32 ERROR in ./~/ws/lib/WebSocketServer.js Module not found: Error: Cannot resolve module 'tls' in D:\temp\socketio-webpack\node_modules\ws\lib @ ./~/ws/lib/WebSocketServer.js 15:10-24 ERROR in ./~/options/lib/options.js Module not found: Error: Cannot resolve module 'fs' in D:\temp\socketio-webpack\node_modules\options\lib @ ./~/options/lib/options.js 6:9-22 ERROR in ./~/mime-db/db.json Module parse failed: D:\temp\socketio-webpack\node_modules\mime-db\db.json Line 2: Unexpected token : You may need an appropriate loader to handle this file type. | { | "application/1d-interleaved-parityfec": { | "source": "iana" | }, @ ./~/mime-db/index.js 11:17-37 

webpack seems to parse the modules from the node_modules directory, although I explicitly included only the src directory.

Answer 1

Webpack is simply trying to solve all the requirements. When you add the server application, you should do a little hack as described here .

 var webpack = require('webpack'); var path = require('path'); var fs = require('fs'); var nodeModules = {}; fs.readdirSync('node_modules') .filter(function(x) { return ['.bin'].indexOf(x) === -1; }) .forEach(function(mod) { nodeModules[mod] = 'commonjs ' + mod; }); module.exports = { entry: './src/main.js', target: 'node', output: { path: path.join(__dirname, 'build'), filename: 'backend.js' }, externals: nodeModules }