All of a sudden margin padding font etc of PrimeNg gone crazy when i upgraded my versions to 16 (Both Angular as well as PrimeNg). This is my package.json:
{
...
"private": true,
"dependencies": {
"@angular/animations": "^16.2.12",
"@angular/common": "^16.2.12",
"@angular/compiler": "^16.2.12",
"@angular/core": "^16.2.12",
"@angular/forms": "^16.2.12",
"@angular/platform-browser": "^16.2.12",
"@angular/platform-browser-dynamic": "^16.2.12",
"@angular/router": "^16.2.12",
...
"bootstrap": "^5.2.1",
"file-saver": "^2.0.5",
"jquery": "^3.6.1",
"popper.js": "^1.16.1",
"primeicons": "^6.0.1",
"primeng": "^16.4.3",
"primeflex": "^2.0.0",
"rxjs": "^7.8.1",
"tslib": "^2.3.0",
"zone.js": "~0.13.3"
},
"devDependencies": {
"@angular-devkit/build-angular": "^16.2.13",
"@angular/cli": "~16.2.13",
"@angular/compiler-cli": "^16.2.12",
"@types/file-saver": "^2.0.5",
"@types/jasmine": "~4.0.0",
"jasmine-core": "~4.2.0",
"karma": "~6.4.0",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage": "~2.2.0",
"karma-jasmine": "~5.1.0",
"karma-jasmine-html-reporter": "~2.0.0",
"typescript": "^4.8.4"
}
}
angular.json:
"styles": [
"src/styles.scss",
"node_modules/bootstrap/dist/css/bootstrap.min.css",
"node_modules/@fortawesome/fontawesome-free/css/all.css",
"node_modules/primeicons/primeicons.css",
"node_modules/primeng/resources/themes/lara-light-blue/theme.css",
"node_modules/primeng/resources/primeng.min.css",
"node_modules/primeflex/primeflex.css"
],
npm i doesn't gives any error. ng serve is also perfect. No error on console logs. Functionality is also not impacted but the style is severely damaged. I've a major release coming up next week. Please help.