I am trying to construct a tube-map with the help of d3js and Angular. I am using Angular 8 and d3 version 3.4.13. On doing npm start I'm getting a series of errors. Any leads on figuring out why that may be happening would be of great help.
Here is a link to the repository:
https://github.com/reshnaz/Tubemap.git
I'm getting the below errors:
ERROR in ./node_modules/xmlhttprequest/lib/XMLHttpRequest.js
Module not found: Error: Can't resolve 'child_process' in '/home/reshma/Documents/Angular/tubemap_project/tubemap-dashboard/node_modules/xmlhttprequest/lib'
ERROR in ./node_modules/jsdom/lib/jsdom/browser/index.js
Module not found: Error: Can't resolve 'cssstyle' in
'/home/reshma/Documents/Angular/tubemap_project/tubemap-dashboard/node_modules/jsdom/lib/jsdom/browser'
ERROR in ./node_modules/jsdom/lib/jsdom/level2/style.js
Module not found: Error: Can't resolve 'cssstyle' in
'/home/reshma/Documents/Angular/tubemap_project/tubemap-dashboard/node_modules/jsdom/lib/jsdom/level2'
ERROR in ./node_modules/jsdom/lib/jsdom.js
Module not found: Error: Can't resolve 'fs' in
'/home/reshma/Documents/Angular/tubemap_project/tubemap-dashboard/node_modules/jsdom/lib'
ERROR in ./node_modules/jsdom/lib/jsdom/level2/html.js
Module not found: Error: Can't resolve 'fs' in
'/home/reshma/Documents/Angular/tubemap_project/tubemap-dashboard/node_modules/jsdom/lib/jsdom/level2'
ERROR in ./node_modules/xmlhttprequest/lib/XMLHttpRequest.js
Module not found: Error: Can't resolve 'fs' in
'/home/reshma/Documents/Angular/tubemap_project/tubemap-dashboard/node_modules/xmlhttprequest/lib'
ERROR in ./node_modules/jsdom/lib/jsdom.js
Module not found: Error: Can't resolve 'request' in
'/home/reshma/Documents/Angular/tubemap_project/tubemap-dashboard/node_modules/jsdom/lib'
I cannot believe the problem is caused by anything other than the old version of d3 you are using.
The errors you are seeing about missing modules are likely to be because you ran npm install and this generated a load of errors which you either failed to notice or deliberately ignored, and tried to proceed anyway as if nothing was wrong. Or maybe npm install ran fine but your node_modules folder contains a load of cruft left over from the React.js project? What happens if you delete your node_modules folder and try running npm install again?
How the original React.js app you mention worked I can't say, especially since you don't provide a link to the GitHub source code you mention. Perhaps it used an older version of React, which in turn required other older dependencies. Deciding to use the latest version of Angular is somewhat at odds with deciding to use such an old version of d3 in the same project.
The only suggestion I have (if it isn't already obvious) is to bite the bullet and upgrade your project to the latest version of d3. Yes, you will have to change the way your code calls to d3, as d3 has changed somewhat between version 3 and version 5. But that's just too bad.
Deleting node_modules and package-lock.json, followed by npm cache clean and npm install solved the problem.
Related
I have an angular application that uses two libraries locally, however, when trying to build everything ending up with an error of modules not found, but I thought it was some problems of undeclared dependencies, or imported, but everything is fine.
For better understanding, I have: Two local libraries that are used by a test application, where this application consumes both libs, but in the compilation it presents the error of modules not found:
`Error: Module not found: Error: Can't resolve '#ngx-formly/example-kendo' in 'C:\SamuelPierre\Example\Repositório\NgBibliotecas\NgBibliotecas\projects\framework-example\src\app\shared'
Error: projects/framework-example/src/app/app.component.ts:1:34 - error TS2307: Cannot find module '#example-library/identity' or its corresponding type declarations.
1 import { UserTokenService } from '#example-library/identity';
~~~~~~~~~~~~~~~~~~~~~~~`
This error appears for all dependencies, but my main file has all the necessary imports and declarations.
Also, "npm install" to install the libraries doesn't help as they are accessed locally. I've already cleaned the node modules, reinstalled npm, everything is ok, but the problem persists.
maybe you should run npm install or when it just one module just do npm install <module name> -save
Try (in Terminal):
npm install
I want to implement react-loading-overlay in react for full page loaders.
Tried doing following things:
So I tried to install react-overlay-loading but it still shows me the error as above.
What's getting wrong here ? Any ideas ?
You are missing a module which is called react-loading-overlay which you can get by installing the package by using the command:
npm i react-loading-overlay-ts
This should install the required package.
I have a next.js project and I keep getting:
error - ./node_modules/jspdf/dist/jspdf.es.min.js:458:25
Module not found: Can't resolve 'canvg'
I'm not sure why because I'm not including either jspdf or canvg.
Not sure what's causing it. Any help would be appreciated. I'm using material-ui if that matters.
It seems dependency error means that particular Module is missing when it's running.
Run npm ls or yarn list will print to stdout all the versions of packages that are installed, as well as their dependencies, in a tree-structure. Then search for that particulate packages are listed or not.
Run npm ls jspdf or yarn list jspdf then you can see its list of dependencies in tree-structure.
Please check your node version is updated or not ? If not then update first.
Quick & Dirty way: delete package.lock or yarn.lock file and delete .node_modules folders And Then run npm install or yarn to install again.
Look at console while you installing and make sure there are no error in the installing process. If you saw error you better look that massages also.
Im trying to use net core template for react, and for validation purposes I've added react-validation package but it throws an error while starting app:
ERROR in ./~/react-validation/lib/build/validation.js
Module not found: Error: Can't resolve 'classnames' in 'C:\Users\pk\Documents\visual studio 2017\Projects\BetHub\BetHub.UI\node_modules\react-validation\lib\build'
# ./~/react-validation/lib/build/validation.js 3:45-66
# ./ClientApp/boot.tsx
# multi react-hot-loader/patch event-source-polyfill webpack-hot-middleware/client?path=__webpack_hmr&dynamicPublicPath=true ./ClientApp/boot.tsx
It seems as if it was not installed, but I've checked in node_modules an the package is there, anything Im missing?
Thanks for help!
This is actually a problem you should be asking on the npm package's open issues on github. I did a small amount of digging, and it turns out a few other people had the same problem. Their fix: Install classnames
npm install classnames --save
I have an Angular (2+) datepicker component (link to Github) that I am currently using in two Angular projects
Angular CLI v1.0.0-beta.30, Angular v2.3
Angular CLI v1.0.0, Angular v4.0
App 1 works perfectly, both during development using ng serve and when building using ng build -prod --aot. App 2 however throws the following error both when attempting to serve and build;
ERROR in Error encountered resolving symbol values statically. Calling function 'makeDecorator', function calls are not supported. Consider replacing the function or lambda with a reference to an exported function, resolving symbol NgModule in /path/to/angular4-app/node_modules/ic-datepicker/node_modules/#angular/core/src/metadata/ng_module.d.ts, resolving symbol NgModule in /path/to/angular4-app/node_modules/ic-datepicker/node_modules/#angular/core/src/metadata.d.ts, resolving symbol NgModule in /path/to/angular4-app/node_modules/ic-datepicker/node_modules/#angular/core/src/core.d.ts, resolving symbol NgModule in /path/to/angular4-app/node_modules/ic-datepicker/node_modules/#angular/core/index.d.ts, resolving symbol IcDatepickerModule in /path/to/angular4-app/node_modules/ic-datepicker/dist/src/ic-datepicker.module.d.ts, resolving symbol IcDatepickerModule in /path/to/angular4-app/node_modules/ic-datepicker/dist/src/ic-datepicker.module.d.ts
ERROR in ./src/main.ts
Module not found: Error: Can't resolve './$$_gendir/app/app.module.ngfactory' in '/path/to/angular4-app/src'
# ./src/main.ts 4:0-74
# multi ./src/main.ts
My assumption based on this Github issue comment is that the version being used in app 1 above did not perform the static analysis required to trigger this error.
What would cause this error to occur?
Edit
So I've just tried copying the library, stripping it right back to a module and a component that does nothing but output a <h1/> element and try that and the exact same error occurs (link to the stripped back version).
I came across this page and looked into the points there, namely point #8. I moved the Angular dependencies to be peerDependencies (you can see that in the second repo above) but that has not fixed the error.
After hours of digging and trial and error I found the answer. In my question edit I refer to this page and claim that moving the Angular dependencies to peerDependencies in package.json does not fix the issue. This however was not true as I was using npm link to test the library within a new Angular project.
I believe the reason Angular's dependencies should be peerDependencies and not dependencies is because errors occur when node_modules/ic-datepicker/node_modules contains #angular/* dependencies. Moving Angular into peer will instead use the app-level #angular deps preventing this error.
As a side note for anyone who may be testing their local versions of a library, if you have your #angular dependencies added to devDependencies for usage during development, run npm link -production instead of just npm link to prevent the development deps from being installed.