infor-design / enterprise-ng

Angular wrappers for IDS Enterprise components
Apache License 2.0
57 stars 84 forks source link

Webpack has been initialized using a configuration object that does not match the API schema. #1129

Closed manel-abbes closed 2 years ago

manel-abbes commented 3 years ago

Bug Description I updated the version of angular from 11 to 12, i updated also the version of ids-enterprise-ng to 10.6.1, after running npm run start I get this error:

" Invalid configuration object. Webpack has been initialized using a configuration object that does not m
atch the API schema.
[ERROR]  - configuration.node should be o
ne of these:
[ERROR]    false | object { __dirname?, __filename?, global? }
[ERRO
R]    -> Include polyfills or mocks for various node stuff.
[ERROR]    Details:
[ERROR]     * configuration.n
ode has an unknown property 'crypto'. These properties are valid:
[ERROR]       object { __dirname?, __filename
?, global? }
[ERROR]       -> Options object for node compatibility features.
[ERROR
]     * configuration.node has an unknown property 'stream'. These properties are valid:
[ERROR]       object { __dirname?, __file
name?, global? }
[ERROR]       -> Options object for node compatibility features.
[ERROR]     * configur
ation.node has an unknown property 'fs'. These properties are valid:
[ERROR]       object { __dirname?
, __filename?, global? }
[ERROR]       -> Options object for node compatibility features.

this is the package.json file :{

{

  "private": true,
  "dependencies": {
    "@angular-devkit/schematics": "10.1.7",
    "@angular/animations": "^12.2.5",
    "@angular/common": "^12.2.5",
    "@angular/compiler": "^12.2.5",
    "@angular/core": "^12.2.5",
    "@angular/elements": "^12.2.5",
    "@angular/forms": "^12.2.5",
    "@angular/localize": "^10.0.0",
    "@angular/platform-browser": "12.2.0",
    "@angular/platform-browser-dynamic": "12.2.0",
    "@angular/router": "12.2.0",
    "@ng-bootstrap/ng-bootstrap": "^7.0.0",
    "@ngrx/effects": "12.4.0",
    "@ngrx/router-store": "12.4.0",
    "@ngrx/store": "12.4.0",
    "@ngrx/store-devtools": "12.4.0",
    "@nrwl/angular": "12.9.0",
    "@stomp/ng2-stompjs": "^7.2.0",
    "@types/d3": "5.7.2",
    "@types/nvd3": "^1.8.41",
    "@types/underscore": "^1.10.22",
    "alasql": "^0.4.11",
    "angular-gridster2": "^8.4.1",
    "angular-l10n": "^11.0.0",
    "classlist.js": "^1.1.20150312",
    "core-js": "^2.5.4",
    "d3": "5.16.0",
    "date-fns": "^2.24.0",
    "echarts": "^5.1.2",
    "git-describe": "^4.0.4",
    "ids-enterprise-ng": "^10.6.1",
    "jsonwebtoken": "^8.3.0",
    "leaflet": "^1.7.1",
    "mathjs": "^5.2.2",
    "moment": "^2.26.0",
    "ng2-nvd3": "^2.0.0",
    "ng5-slider": "1.1.12",
    "ngx-device-detector": "^1.3.14",
    "ngx-echarts": "^7.0.1",
    "ngx-infinite-scroll": "^10.0.1",
    "ngx-permissions": "*",
    "nvd3": "^1.8.6",
    "primeflex": "^1.0.0",
    "primeicons": "^4.0.0-rc.2",
    "primeng": "^9.1.0",
    "rxjs": "6.5.5",
    "text-encoding": "^0.7.0",
    "tslib": "^1.13.0",
    "underscore": "^1.11.0",
    "web-animations-js": "^2.3.1",
    "zone.js": "0.11.4"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^12.2.5",
    "@angular/cli": "^12.2.5",
    "@angular/compiler-cli": "12.2.0",
    "@angular/language-service": "^12.2.5",
    "@juggle/resize-observer": "^3.3.1",
    "@ngrx/schematics": "12.4.0",
    "@nrwl/cli": "12.9.0",
    "@nrwl/cypress": "12.9.0",
    "@nrwl/jest": "12.9.0",
    "@nrwl/tao": "12.9.0",
    "@nrwl/workspace": "12.9.0",
    "@schematics/angular": "10.1.7",
    "@types/jasmine": "3.6.9",
    "@types/jasminewd2": "~2.0.3",
    "@types/jest": "26.0.8",
    "@types/node": "14.14.33",
    "codelyzer": "6.0.1",
    "cypress": "^4.1.0",
    "dotenv": "10.0.0",
    "eslint": "6.8.0",
    "jasmine-core": "3.6.0",
    "jasmine-spec-reporter": "5.0.2",
    "jest": "27.0.3",
    "jest-preset-angular": "9.0.7",
    "karma": "5.0.9",
    "karma-chrome-launcher": "3.1.0",
    "karma-coverage-istanbul-reporter": "3.0.3",
    "karma-jasmine": "4.0.1",
    "karma-jasmine-html-reporter": "1.5.4",
    "prettier": "2.3.1",
    "protractor": "7.0.0",
    "ts-jest": "27.0.3",
    "ts-node": "9.1.1",
    "tslint": "6.1.3",
    "typescript": "^4.2.4",
    "webpack-bundle-analyzer": "^4.3.0"
  }
}

is there any way to fix it thank you .

Steps to Reproduce -run command nx migrate latest -upgrade the version ids-enterprise-ng to 10.6.1 -upgrade the version node js to 12.18.3 -run npm run start -build failure - -display error : Webpack has been initialized using a configuration object that does not match the API schema.

Expected behavior

Platform OS Version: [Windows 10] Browser Name [chrome] Browser Version 86.0.4240.75 (Official Build) (64-bit)

tmcconechy commented 3 years ago

i tried to upgrade https://github.com/infor-design/enterprise-ng-quickstart and did not run into any issues. I just used this.

Also no sure what nx migrate latest is?

So i assume the issue is on your end so not much we can do. Unless you can reproduce this in the quickstart? i think you want to

a) use angular cli and make a new project and add ids-enterprise and confirm it all works - if it does use the config to compare you your project, if not zip the project and upload it (without the node_modules) b) try all steps on https://update.angular.io/ c) further inspect your config

manel-abbes commented 2 years ago

Hello, thank you for your help, it works now.