I have encountered an error when using the latest version of Webpack (5.1.0). It looks like the configuration is throwing an error because the validation schema is too restrictive. Here is my webpack configuration file in a gist, and the error message I am seeing.
Webpack.config.js
https://gist.github.com/adarshbhat/3ec5950b66b78102da0cf46e51a3d633
Error
[webpack-cli]
Invalid configuration object. Webpack has been initialized using a configuration object that does not match the API schema.
- configuration.node should be one of these:
false | object { __dirname?, __filename?, global? }
-> Include polyfills or mocks for various node stuff.
Details:
* configuration.node has an unknown property 'module'. These properties are valid:
object { __dirname?, __filename?, global? }
-> Options object for node compatibility features.
* configuration.node has an unknown property 'net'. These properties are valid:
object { __dirname?, __filename?, global? }
-> Options object for node compatibility features.
* configuration.node has an unknown property 'fs'. These properties are valid:
object { __dirname?, __filename?, global? }
-> Options object for node compatibility features.
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! jstest@1.0.0 start: `webpack serve`
npm ERR! Exit status 2
I am attempting to use a parser generator library (antlr4) that works both in a Node.js environment, as well as in browsers. It looks like the library code is requiring global objects like fs, and if it is empty, assumes that it is in a browser environment. According to the documentation of Antlr4 and that of Webpack , this is a supported configuration file. But it is not working. Please help.
Versions
Update (Oct 29 2020)
Antlr JavaScript documentation has now been updated with the new configuration for Webpack 5
I managed to get this to work with some help from the Webpack team. Using the following webpack configuration as recommended by the antlr4 documentation is no longer supported.
Does not work
{
node: {
fs: 'empty',
module: 'empty',
net: 'empty'
}
}
Working configuration
{
resolve: {
fallback: {
fs: false
}
}
}
With this, I was able to get my JavaScript parser working.
Please note that there is an ongoing effort to update antlr4 to generate ES6 based code. This configuration may not be necessary in the future.
Exactly for rails webpacker, if you are using it, the solution should be a:
Inside any of config/webpack/*.js which uses the plain custom config (see https://github.com/rails/webpacker#webpack-configuration for more), just add the code resolving and removing the node property.
const { environment } = require('@rails/webpacker')
const customConfig = {
resolve: {
fallback: {
dgram: false,
fs: false,
net: false,
tls: false,
child_process: false
}
}
};
environment.config.delete('node.dgram')
environment.config.delete('node.fs')
environment.config.delete('node.net')
environment.config.delete('node.tls')
environment.config.delete('node.child_process')
environment.config.merge(customConfig);
module.exports = environment