CODEWITHSUNDEEP
ruby-on-railswebpack
LewlSauce
LewlSauce

Reputation: 5882

Webpack has been initialized using a configuration object that doesn't match the API schema

Using Ruby on Rails (6.1.4.4) and constantly getting the following error after upgrading webpack from 4.46.0 to 5.67.0 and webpack-cli from version 3.3.12 to 4.9.2:

root@b26d476dafbd:/myapp$ bin/webpack
[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 'dgram'. 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.
    * 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 'tls'. These properties are valid:
      object { __dirname?, __filename?, global? }
      -> Options object for node compatibility features.
    * configuration.node has an unknown property 'child_process'. These properties are valid:
      object { __dirname?, __filename?, global? }
      -> Options object for node compatibility features.

Here's an example of my package.json:

{
  "name": "vspm",
  "private": true,
  "dependencies": {
    "@claviska/jquery-minicolors": "^2.3.6",
    "@rails/activestorage": "^7.0.1",
    "@rails/ujs": "^7.0.1",
    "@rails/webpacker": "5.4.3",
    "add": "^2.0.6",
    "bootstrap": "5.1.3",
    "bootstrap4-tagsinput": "^4.1.3",
    "bufferutil": "^4.0.6",
    "cocoon": "github:nathanvda/cocoon#c24ba53",
    "datatables.net": "^1.11.4",
    "datatables.net-bs4": "^3.2.2",
    "google-libphonenumber": "^3.2.26",
    "intl-tel-input": "^17.0.15",
    "jquery": "^3.6.0",
    "jquery-mask-plugin": "^1.14.16",
    "justgage": "^1.5.1",
    "moment": "^2.29.1",
    "node-waves": "^0.7.6",
    "popper.js": "^1.16.1",
    "raphael": "^2.3.0",
    "textlint": "^12.1.0",
    "utf-8-validate": "^5.0.8",
    "webpack": "^5.67.0",
    "webpack-cli": "^4.9.2",
    "yarn": "^1.22.17"
  },
  "description": "This README would normally document whatever steps are necessary to get the application up and running.",
  "version": "1.0.0",
  "main": "pdf.js",
  "directories": {
    "lib": "lib",
    "test": "test"
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "repository": {
    "type": "git",
    "url": "git+https://github.com/altjx/goku.git"
  },
  "author": "",
  "license": "ISC",
  "bugs": {
    "url": "https://github.com/altjx/goku/issues"
  },
  "homepage": "https://github.com/altjx/goku#readme",
  "devDependencies": {
    "@babel/plugin-transform-strict-mode": "^7.16.7",
    "webpack-dev-server": "^4.7.3"
  }
}

Not quite sure what would cause this in the upgrade. Unfortunately, I'm not even sure where the error message is even pointing to in terms of what the issue really is here.

Upvotes: 4

Views: 1307

Answers (1)

Yilmaz
Yilmaz

Reputation: 49561

Looks like in webpack4 you had node polyfils set but in webpack5 automatic-nodejs-polyfills-removed

Easies way to set the polyfills in webpack5 is npm i node-polyfill-webpack-plugin. in webpack.config.js

const NodePolyfillPlugin = require("node-polyfill-webpack-plugin");

plugins: [
  new NodePolyfillPlugin(),
],

Upvotes: 1

Related Questions