In Angular project, we may need to have jquery.js library when we there are dependency on jquery library. Those situation enforce us to add jquery.js file to our Angular project. In the respective scenario, after adding jquery.js file into the project and trying to reference same in angular.json file, we may encounter this error, if path is not specified properly.
Problem
After adding reference of jquery in angular.json and try to compile the application, I was getting this below error:
Generating browser application bundles (phase: setup)…An unhandled exception occurred: Script file ../node_modules/jquery/dist/jquery.js does not exist.
See “\AppData\Local\Temp\ng-nuW3dJ\angular-errors.log” for further details.
The reference was given as below screen shot:
In above screen shot, line number 32 and 33 are two javascript file reference which I was trying to add into the project. In that jquery.js is one of them. Practically both javascripts were failing to get referred in the project due to wrong relative path.
Solution
The solution for this issues is very simple. I supposed to correct wrong relative path while referencing jquery.js file in angular.json file.
In the above screenshot I have corrected the relative path. I supposed to remove extra dot based on where jquery.js file is placed. Please read more about relative path to understand how to correct these kid of issues.
Once the relative path corrected in angular.json file, the error was resolved.
Summary
To avoid these kind of issues, we supposed to understand how relative path works and based on that we can solve these kind of issues.