Dynamic `require` in VrpcAdapter.js breaks webpack 5 about vrpc-js HOT 4 CLOSED

Thanks for reporting this. I as well encountered the warning and wasn't sure about its origin. That's clearly something to be urgently fixed as especially CI tools will immediately error-out as compilation warnings are typically escalated to errors.

The issue will be worked on with high priority.

from vrpc-js.

Branch bugfix/36-dynamic-require-in-vrpcadapter-js-breaks-webpack-5 created!

from vrpc-js.

As we were discussing this for the Connectware, we saw that the problem with the dynamic require is a problem only in the frontend. The usage of that feature, on the other hand, is only in the backend (the protocol-mapper, as you remember). So one solution here would be to separate it out of the main VrpcAdapter class into something that can be require-d in the backend but not in the frontend.

from vrpc-js.

To add more information, as we are updating the front-end bundler, the new Webpack v5 has found some issues regarding vrpc that required custom configuration.

Dealing with the dynamic resolver
The bundler will go through all the dependencies referenced by the entry point file (usually src/index.js) and attempt to bundle every referenced file into N output files on the created bundle.

Therefore the dynamic resolver should not work on the frontend, as the dynamic files will never be loaded there.
Due to the dynamic resolver though, webpack will try then to load every file (included python scripts on other misc files), in order to, I think, achieve the least amount of module-not-found-failures.

To fix this, I had to add this custom webpack v5 resolver rule:

{
     /**
     * if vrpc, ignore non js/jsx files
     */
    test: { and: [/(node_modules\/vrpc)/i, { not: [/\.(js|jsx)$/] }] },
    loader: 'ignore-loader'
}

Before, the react-scripts would just ignore the errors when loading files, and use only js files that were successfully parsed.

Fallbacks and global definitions

I also noticed some references to node core libraries/classes, such as os, fs, Buffer and path.
The react-scripts bundler pre-loaded these into the outputted bundle which omitted any errors.
As Webpack removes the kid bicycle wheels, I had to add these configurations:

Fallback configuration, so I can tell webpack to load my browserfied alternatives instead of telling me os is not compatible with frontend.

{
    os: require.resolve("os-browserify/browser"),
    "crypto": require.resolve("crypto-browserify"),
    "stream": require.resolve("stream-browserify"),
    "path": require.resolve("path-browserify"),
    fs: false
}

Define plugin configuration so I can tell Webpack that a global variable named Buffer needs to exist

{
    Buffer: ['buffer', 'Buffer'],
    process: 'process/browser',
}

I'm not saying all the libs above are used on the vrpc, but some for sure are, I would suggest having a strictly front-end section of the vrpc project so it can either load the browserfied versions of that code, or not use them all together.

Let me know if you need more comments.

from vrpc-js.