WARNING in ./node_modules/pdfjs-dist/build/pdf.js Module not found: Error: Can't resolve 'zlib' in 'ui_angular_6\node_modules\pdfjs-dist\build' - angular6

I was trying to migrate my angular 5 code to angular 6.
After doing npm start getting the below problem
npm start
WARNING in ./node_modules/pdfjs-dist/build/pdf.js
Module not found: Error: Can't resolve 'zlib' in '\ui_angular_6\node_modules\pdfjs-dist\build'
Package.json
"dependencies": {
"#angular/animations": "6.0.2",
"#angular/common": "6.0.2",
"#angular/compiler": "6.0.2",
"#angular/core": "6.0.2",
"#angular/flex-layout": "^6.0.0-beta.15",
"#angular/forms": "6.0.2",
"#angular/http": "6.0.2",
"#angular/platform-browser": "6.0.2",
"#angular/platform-browser-dynamic": "6.0.2",
"#angular/router": "6.0.2",
"#ng-bootstrap/ng-bootstrap": "^1.1.2",
"angular-font-awesome": "^3.1.2",
"body-parser": "^1.18.2",
"bootstrap": "^4.1.0",
"core-js": "^2.4.1",
"elasticsearch": "^15.1.1",
"elasticsearch-browser": "^15.1.1",
"express": "^4.16.3",
"font-awesome": "^4.7.0",
"jquery": "^3.3.1",
"ng2-pdf-viewer": "^5.1.1",
"npm": "^6.0.1",
"popper.js": "^1.14.3",
"rxjs": "^6.1.0",
"rxjs-compat": "^6.1.0",
"underscore": "^1.8.3",
"zone.js": "^0.8.26"
}
Please help me to fix this issue.

Try by placing this in your package.json file:
"browser": {
"zlib":false }

There was a fix for this issue in the following PR https://github.com/mozilla/pdf.js/pull/9924 (merged 12 days ago). You may want upgrading to the latest "pdfjs-dist" to fix the issue.

Related

Build Issue With Angular Project while updating Angular 7 to 13

I wanted to upgrade the Angular version in my project from 7 to 13, but I am facing some issues. Below you can see my package in Json format:
{
"name": "comresi-angular",
"version": "0.0.0",
"scripts": {
"start": "ng serve",
"start:local": "ng serve --base-href=/",
"build:prod": "ng build --configuration production",
"build:dev": "ng build ----configuration dev",
"build:local": "npm run build:dev && npm run copy_tomcat",
"copy_tomcat": "xcopy \"../webapp/resources\\*\" \"%CATALINA_HOME%\\webapps\\erlcr\\resources\" /s /i /y > nul"
},
"private": true,
"dependencies": {
"#angular/animations": "~13.1.0",
"#angular/cdk": "~13.1.0",
"#angular/common": "~13.1.0",
"#angular/compiler": "~13.1.0",
"#angular/core": "~13.1.0",
"#angular/forms": "~13.1.0",
"#angular/http": "^7.0.0",
"#angular/material": "~13.1.0",
"#angular/platform-browser": "~13.1.0",
"#angular/platform-browser-dynamic": "~13.1.0",
"#angular/service-worker": "~13.1.0",
"#angular/router": "~13.1.0",
"#ngx-translate/core": "11.0.1",
"#ngx-translate/http-loader": "4.0.0",
"#types/bingmaps": "0.0.1",
"#types/jquery": "^3.3.22",
"#types/npm": "^2.0.29",
"#types/slickgrid": "^2.1.26",
"ag-grid-angular": "^19.0.0",
"ag-grid-community": "^19.0.0",
"angular-maps": "^6.0.1",
"angular-slickgrid": "^2.1.8",
"bingmaps": "^2.0.3",
"bootstrap": "^4.1.3",
"core-js": "^2.5.4",
"dhtmlx-gantt": "file:gantt_7.1.8_evaluation",
"font-awesome": "^4.7.0",
"jquery": "^3.3.1",
"jqwidgets-scripts": "^6.1.0",
"moment": "^2.19.1",
"rxjs": "~7.4.0",
"rxjs-compat": "^7.4.0",
"zone.js": "~0.11.4"
},
"devDependencies": {
"#angular-devkit/build-angular": "13.1.2",
"#angular/cli": "~13.1.0",
"#angular/compiler-cli": "~13.1.0",
"#angular/language-service": "~13.1.0",
"#types/jasmine": "~2.8.8",
"#types/jasminewd2": "~2.0.3",
"#types/node": "~8.9.4",
"codelyzer": "~4.3.0",
"jasmine-core": "~2.99.1",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~3.0.0",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "~2.0.1",
"karma-jasmine": "~1.1.2",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "~5.4.0",
"ts-node": "~7.0.0",
"tslint": "~5.11.0",
"typescript": "~4.4.3",
"rxjs": "~7.4.0"
}
}
but I am getting the following error while running npm install:
While resolving: comresi-angular#0.0.0
Found: #angular-devkit/build-angular#0.10.7
node_modules/#angular-devkit/build-angular
dev #angular-devkit/build-angular#"13.1.2" from the root project
Could not resolve dependency:
dev #angular-devkit/build-angular#"13.1.2" from the root project
Conflicting peer dependency: #angular/core#13.1.1
node_modules/#angular/core
peer #angular/core#"13.1.1" from #angular/service-worker#13.1.1
node_modules/#angular/service-worker
#angular/service-worker#"~13.1.0" from the root project
peerOptional #angular/service-worker#"^13.0.0 || ^13.1.0-next" from #angular-devkit/build-angular#13.1.2
node_modules/#angular-devkit/build-angular
dev #angular-devkit/build-angular#"13.1.2" from the root project
Could you help me to understand why I am getting that error?
If you use the official angular update website and you put your angular versions From 7.0 To 13.0 you will get the following warning:
so obviously you need to go through all the major versions until v13.0
As per my experience with project. It is better to build a simple product with latest version (or version which you want). and add a component from your existing application gradually.

Angular 6: error TS2315: Type 'ModuleWithProviders' is not generic - core and forms versions is same

My routing was not working correctly, I have separate paths for two components but still they were shown one below the other in second component's path, reason: below error in my console,
Inspite of trying the solution given here ANGULAR 6: error TS2315: Type 'ModuleWithProviders' is not generic,
I am still getting same error, and now it is not even compiling.
I am searching solution since past few hours but no luck.
ERROR in node_modules/#angular/platform-browser/src/browser.d.ts(45,9): error TS2315: Type >'ModuleWithProviders' is not generic.
node_modules/#angular/router/src/router_module.d.ts(101,60): error TS2315: Type >'ModuleWithProviders' is not generic.
node_modules/#angular/router/src/router_module.d.ts(105,38): error TS2315: Type >'ModuleWithProviders' is not generic.
Below is my package.json,
{
"name": "cakewale",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"#angular/animations": "^6.0.0",
"#angular/cdk": "^6.0.0",
"#angular/common": "^6.0.3",
"#angular/compiler": "^6.0.3",
"#angular/core": "6.0.3",
"#angular/forms": "6.0.3",
"#angular/http": "^6.0.3",
"#angular/platform-browser": "^6.0.3",
"#angular/platform-browser-dynamic": "^6.0.3",
"#angular/router": "^6.0.3",
"animate.css": "^3.7.2",
"core-js": "^2.5.4",
"rxjs": "6.0.0",
"wowjs": "^1.1.3",
"zone.js": "^0.8.26"
},
"devDependencies": {
"#angular-devkit/build-angular": "~0.6.8",
"#angular/cli": "~6.0.8",
"#angular/compiler-cli": "^6.0.3",
"#angular/language-service": "^6.0.3",
"#types/jasmine": "~2.8.6",
"#types/jasminewd2": "~2.0.3",
"#types/node": "~8.9.4",
"codelyzer": "~4.2.1",
"jasmine-core": "~2.99.1",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~1.7.1",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "~2.0.0",
"karma-jasmine": "~1.1.1",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "~5.3.0",
"shallow-render": "^7.2.0",
"ts-node": "~5.0.1",
"tslint": "~5.9.1",
"typescript": "~2.7.2"
}
}
I was thinking to change the versions to 6.1.2, but I am scared it might result in altogether new errors, would anyone recommend that?
I am not able to figure out what am I missing, please help.
Thanks for any help.
I was trying to use some new libraries and guess accidentally mismatched the versions of #angular/core #angular/router #angular/platform-browser
I removed the ^ sign from versions of all the three above to make sure their versions are exactly same, it worked.

ERROR in ./node_modules/ng2-smart-table/ng2-smart-table.ngfactory.js

I am getting the below error. when i do "ng build --prod --aot"
ERROR in ./node_modules/ng2-smart-table/ng2-smart-table.ngfactory.js
Module not found: Error: Can't resolve '../#akveo/ng2-completer/ng2-completer.ngfactory' in 'C:\Shruthi\Applications\PULSE\Q2-error\pulse\Pulse-web\node_modules\ng2-smart-table'
everything works fine when i do ng build.
I am getting this error from yesterday everything was working fine in before yesterday.
Is it error because of ng2-completer or something related ng build or angular version.
below is my package.json
{
"name": "pulse-web",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e",
"compodoc": "compodoc",
"generate-docs": "compodoc -p src/tsconfig.app.json",
"serve-docs": "compodoc -s src/tsconfig.app.json"
},
"private": true,
"dependencies": {
"#akveo/ng2-completer": "^9.0.1",
"#amcharts/amcharts4": "^4.9.6",
"#angular/animations": "~7.2.0",
"#angular/cdk": "~7.2.0",
"#angular/common": "~7.2.0",
"#angular/compiler": "~7.2.0",
"#angular/core": "~7.2.0",
"#angular/forms": "~7.2.0",
"#angular/http": "^7.2.16",
"#angular/material": "~7.2.0",
"#angular/platform-browser": "~7.2.0",
"#angular/platform-browser-dynamic": "~7.2.0",
"#angular/router": "~7.2.0",
"#compodoc/compodoc": "^1.1.11",
"#mc-dxp/dxp-styles": "^3.2.1",
"#mc-dxp/dxp-web": "^4.1.1",
"#ng-bootstrap/ng-bootstrap": "^4.1.5",
"#syncfusion/ej2-angular-buttons": "^17.4.49",
"#syncfusion/ej2-angular-lists": "^17.4.47",
"#syncfusion/ej2-angular-navigations": "^17.4.49",
"#types/crypto-js": "^3.1.43",
"acorn": "^6.1.1",
"bootstrap": "^4.4.1",
"core-js": "^2.5.4",
"jquery": "^3.4.1",
"jw-angular-pagination": "^1.1.0",
"moment": "^2.24.0",
"ng2-completer": "^2.0.8",
"ng2-smart-table": "^1.5.0",
"ngx-bootstrap": "^5.3.2",
"ngx-cookie-service": "^2.3.0",
"ngx-select-dropdown": "1.3.0",
"popper.js": "^1.16.1",
"rxjs": "~6.3.3",
"rxjs-compat": "^6.5.4",
"tslib": "^1.9.0",
"zone.js": "~0.8.26"
},
"devDependencies": {
"#angular-devkit/build-angular": "~0.13.0",
"#angular/cli": "~7.3.8",
"#angular/compiler-cli": "~7.2.0",
"#angular/language-service": "~7.2.0",
"#types/node": "~8.9.4",
"#types/jasmine": "~2.8.8",
"#types/jasminewd2": "~2.0.3",
"codelyzer": "~4.5.0",
"jasmine-core": "~2.99.1",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~4.0.0",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "~2.0.1",
"karma-jasmine": "~1.1.2",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "~5.4.0",
"ts-node": "~7.0.0",
"tslint": "~5.11.0",
"typescript": "~3.2.2"
}
}
Pleas help me! Not able to figure out the reason
It seems to be a problem with the library itself. See this: https://github.com/akveo/ng2-smart-table/issues/1143. We are also facing the same problem while upgrading our application to Angular 9.
If you are using Ang 9
Upgrade these libraries to these versions
"ng2-completer": "^9.0.1",
"ng2-smart-table": "^1.6.0",
"typescript": "3.8.3" // note explicit ie no "~" or "^"

Angular 6 Cannot read property 'getScroll' of undefined

So far when I run my angular application , I got error below like that.
at updatePosition (vendor.39816f62eefbe817c97e.js:1)
at e.invokeTask (polyfills.8b3031f6891125c33792.js:1)
at Object.onInvokeTask (vendor.39816f62eefbe817c97e.js:1)
at e.invokeTask (polyfills.8b3031f6891125c33792.js:1)
at t.runTask (polyfills.8b3031f6891125c33792.js:1)
at t.invokeTask [as invoke] (polyfills.8b3031f6891125c33792.js:1)
at _ (polyfills.8b3031f6891125c33792.js:1)
at m (polyfills.8b3031f6891125c33792.js:1)
package.json
"dependencies": {
"#angular/animations": "^6.1.0",
"#angular/cdk": "^6.4.7",
"#angular/common": "^6.1.0",
"#angular/compiler": "^6.1.0",
"#angular/core": "^6.1.0",
"#angular/forms": "^6.1.0",
"#angular/http": "^6.1.0",
"#angular/platform-browser": "^6.1.0",
"#angular/platform-browser-dynamic": "^6.1.0",
"angularfire2": "^5.0.0-rc.4" //I already installed
}

Seeing error when I tried to update Angular CLI version in the project

My project has the following dependencies in package.json.
"dependencies": {
"#angular/animations": "^6.0.3",
"#angular/cdk": "^6.1.0",
"#angular/common": "^6.0.3",
"#angular/compiler": "^6.0.3",
"#angular/core": "^6.0.3",
"#angular/forms": "^6.0.3",
"#angular/http": "^6.0.3",
"#angular/material": "^6.1.0",
"#angular/platform-browser": "^6.0.3",
"#angular/platform-browser-dynamic": "^6.0.3",
"#angular/router": "^6.0.3",
"core-js": "^2.4.1",
"json-server": "^0.12.1",
"moment": "^2.22.1",
"rxjs": "^6.2.0",
"rxjs-compat": "^6.2.0",
"zone.js": "^0.8.26"
}
I want to use version 6.1.0 so I updated the package.json to following
"dependencies": {
"#angular/animations": "^6.1.0",
"#angular/cdk": "^6.1.0",
"#angular/common": "^6.1.0",
"#angular/compiler": "^6.1.0",
"#angular/core": "^6.1.0",
"#angular/forms": "^6.1.0",
"#angular/http": "^6.1.0",
"#angular/material": "^6.1.0",
"#angular/platform-browser": "^6.1.0",
"#angular/platform-browser-dynamic": "^6.1.0",
"#angular/router": "^6.0.3",
"core-js": "^2.5.4",
"json-server": "^0.12.1",
"moment": "^2.22.1",
"rxjs": "^6.2.0",
"rxjs-compat": "^6.2.0",
"zone.js": "^0.8.26"
}
But I notice an error from the IDE The installed version didn't match version range for few entries. I thought that if I specify new versions here then the versions will be automatically updated. Isn't that the case? How can I upgrade the dependencies?
I have ng installed both globally (version 6.2.1) and locally (version 6.0.7). Their versions are different. I want to update local to the higher version and to do this, I thought I'll just update entries in package.json.
I suppose the correct way is to run ng update and that should list all the packages that need updating. As I have ng installed both locally and globally, if I just do ng update, I see message ``.
To be sure that I am updating using the local version, I use npx ng update to list the modules which need updating and use npx ng update -all to update all of them.