GitHub | Documentation | Become a Patron

I would like to run colyseus using webpack but it's not working :/ (solved)



  • Hello it's my first topic here if there is rules don't hesitate to tell me :

    I'm compiling my react with webpack but i would like to add colyseus ...

    I run it on server side it's ok ... but when i add it to the client side it's crashing :

    import React, { Component } from "react";
    import ReactDOM from "react-dom";
    import * as Colyseus from "colyseus"
    
    class Salut extends Component {
        constructor(props) {
            super(props)
    
            this.state = {
                clientId: null
            }
        }
    
        componentDidMount() {
            this.client = new Colyseus.Client('ws://localhost:4000')
            this.room = this.client.join('room')
    
            this.setState({
                clientId: this.client.id
            })
        }
    
        render() {
            const { clientId } = this.state
    
            return (
                <div>
                    Salut {clientId} !
                </div>
            )
        }
    }
    
    
    
    ReactDOM.render(
        <Salut />,
        document.getElementById("app")
    );
    

    here is my stack :

    
        WARNING in ./node_modules/ws/lib/buffer-util.js
        Module not found: Error: Can't resolve 'bufferutil' in '/project/node_modules/ws/lib'
         @ ./node_modules/ws/lib/buffer-util.js 56:21-42
         @ ./node_modules/ws/lib/sender.js
         @ ./node_modules/ws/index.js
         @ ./node_modules/colyseus/lib/Server.js
         @ ./node_modules/colyseus/lib/index.js
         @ ./src/web/index.js
         @ multi (webpack)-dev-server/client?http://0.0.0.0:8080 ./src/web/index.js
    
        WARNING in ./node_modules/ws/lib/validation.js
        Module not found: Error: Can't resolve 'utf-8-validate' in '/project/node_modules/ws/lib'
         @ ./node_modules/ws/lib/validation.js 4:22-47
         @ ./node_modules/ws/lib/sender.js
         @ ./node_modules/ws/index.js
         @ ./node_modules/colyseus/lib/Server.js
         @ ./node_modules/colyseus/lib/index.js
         @ ./src/web/index.js
         @ multi (webpack)-dev-server/client?http://0.0.0.0:8080 ./src/web/index.js
    
        ERROR in ./node_modules/memshared/lib/index.js
        Module not found: Error: Can't resolve 'cluster' in '/project/node_modules/memshared/lib'
         @ ./node_modules/memshared/lib/index.js 6:14-32
         @ ./node_modules/colyseus/lib/presence/MemsharedPresence.js
         @ ./node_modules/colyseus/lib/index.js
         @ ./src/web/index.js
         @ multi (webpack)-dev-server/client?http://0.0.0.0:8080 ./src/web/index.js
    
        ERROR in ./node_modules/redis-parser/lib/hiredis.js
        Module not found: Error: Can't resolve 'hiredis' in '/project/node_modules/redis-parser/lib'
         @ ./node_modules/redis-parser/lib/hiredis.js 3:14-32
         @ ./node_modules/redis-parser/lib/parser.js
         @ ./node_modules/redis-parser/index.js
         @ ./node_modules/redis/index.js
         @ ./node_modules/colyseus/lib/presence/RedisPresence.js
         @ ./node_modules/colyseus/lib/index.js
         @ ./src/web/index.js
         @ multi (webpack)-dev-server/client?http://0.0.0.0:8080 ./src/web/index.js
    
        ERROR in ./node_modules/redis/index.js
        Module not found: Error: Can't resolve 'net' in '/project/node_modules/redis'
         @ ./node_modules/redis/index.js 3:10-24
         @ ./node_modules/colyseus/lib/presence/RedisPresence.js
         @ ./node_modules/colyseus/lib/index.js
         @ ./src/web/index.js
         @ multi (webpack)-dev-server/client?http://0.0.0.0:8080 ./src/web/index.js
    
        ERROR in ./node_modules/ws/lib/websocket.js
        Module not found: Error: Can't resolve 'net' in '/project/node_modules/ws/lib'
         @ ./node_modules/ws/lib/websocket.js 7:12-26
         @ ./node_modules/ws/index.js
         @ ./node_modules/colyseus/lib/Server.js
         @ ./node_modules/colyseus/lib/index.js
         @ ./src/web/index.js
         @ multi (webpack)-dev-server/client?http://0.0.0.0:8080 ./src/web/index.js
    
        ERROR in ./node_modules/redis/index.js
        Module not found: Error: Can't resolve 'tls' in '/project/node_modules/redis'
         @ ./node_modules/redis/index.js 4:10-24
         @ ./node_modules/colyseus/lib/presence/RedisPresence.js
         @ ./node_modules/colyseus/lib/index.js
         @ ./src/web/index.js
         @ multi (webpack)-dev-server/client?http://0.0.0.0:8080 ./src/web/index.js
    
        ERROR in ./node_modules/ws/lib/websocket.js
        Module not found: Error: Can't resolve 'tls' in '/project/node_modules/ws/lib'
         @ ./node_modules/ws/lib/websocket.js 8:12-26
         @ ./node_modules/ws/index.js
         @ ./node_modules/colyseus/lib/Server.js
         @ ./node_modules/colyseus/lib/index.js
         @ ./src/web/index.js
         @ multi (webpack)-dev-server/client?http://0.0.0.0:8080 ./src/web/index.js
    

    and here my webpack file :

    const path = require("path");
    const HtmlWebpackPlugin = require("html-webpack-plugin");
    const NodeExternals = require("webpack-node-externals");
    
    const universalRules = [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        use: {
          loader: "babel-loader",
          options: {
            presets: ["@babel/preset-env", "@babel/react"]
          }
        }
      }
    ];
    
    module.exports = [
      {
        mode: "development",
        entry: "./src/web/index.js",
        output: {
          filename: "bundle.js",
          path: path.resolve(__dirname, "build")
        },
        plugins: [
          new HtmlWebpackPlugin({
            template: "src/index.html"
          })
        ],
        module: {
          rules: [...universalRules]
        },
        devServer: {
          contentBase: "./build",
          host: "0.0.0.0",
          disableHostCheck: true
        }
      }
    ];
    

    I hope there is a way to fix it else i'll just open a bug on github ... it should be help full



  • I found the problem by myself ... -_- i was using colyseus server side


Log in to reply
 

Looks like your connection to Colyseus Forum was lost, please wait while we try to reconnect.