CI/CD pipeline deployment of AngularJS1.5.11 to azure websites giving error "Failed to instantiate module app.core due to Unknown provider: ENV_VARS" - angularjs

after deploying the "AngularJs_1.5.11" app to "azure-websites" using "azure-devops" continuous-integration and deployment gives error:
[$injector:modulerr] Failed to instantiate module app due to:
Error: [$injector:modulerr] Failed to instantiate module app.core due to:
Error: [$injector:unpr] Unknown provider: ENV_VARS
below is the screenshot of the error while accessing the AngularJS azure-website :
also find below screenshot of my build pipeline in azure-devops which deploys AngularJS application build to "azure-websites"
below screenshot is my application code in VSCode
I just started working on this new project which uses AngularJS_1.5.11 so I have no clue what is going wrong. I tried these links
unknown ENV provider in AngularJS from stack but as I am new to AngularJS I have no idea where to apply the changes in my code mentioned in the link.
Any suggestions would be of great help.
Edit:
#Mark if you look at the screenshots below you will come to know how we are setting "ENV_VARS" in the code using "gulp.js, env.config.js, config.json" file
Edit1:
#Mark please find the screenshot of the 'config.js' file which gets created in the gulp task 'ng-config' using source file 'config.json' under "./src/client/app/config.js"

Here are the docs regarding the knowledge relevant to this issue.
Somewhere in your program, it is trying to reference one or more members defined in an angular provider registered as "ENV_VARS". Providers are angularjs objects that are available during compile time (see the table row for "object available in config phase" in this SO answer)
I would search the source of the application to see if this provider was further configured elsewhere (you can search by its name 'ENV_VARS') as it may not be getting sent over with your other source files.
To attempt a quick fix:
On the first line of your app.module.js, change it to this
angular.module('app.config', []).constant("ENV_VARS", {});
This will likely result in another error, but it should pinpoint you to what is trying to access this provider. I'm assuming this is either inherited code or from a purchased template so you may want to investigate the sources to that if possible.

Related

Debugging AngularJs, how to locate the error

I have an Angular application that I have been asked to refactor.
The files are very large and when I make a typo I get an error similar to below, which doesn't really tell me much other than the file for the LiveServiceProvider won't parse. (In this example I had a factory with a mistake in the camel-casing of a variable).
Error: [$injector:unpr] Unknown provider: LiveProfilesServiceProvider <- LiveProfilesService <- LiveDeliveryProfilesController <- LiveDeliveryProfilesController
Is there a way to find out what part of the file is causing the problem?
There is no other way than to undertstand from console messages.
You are injecting LiveProfilesService into LiveDeliveryProfilesController controller, but AngularJs cant find LiveProfilesService.
Reason:
Service name (LiveProfilesService) that you are injecting is incorrect, OR
Service JS file has not been included in html file.
You wont get such detailed error on angular.min.js files so use minified ones in production only.

Is ObjectPath.js necessary for Angular Schema Form to work?

I am trying to dynamically generate a form from JSON data. I found Angular Schema Form to handle this, but I couldn't get it to work. I kept getting this injection failed error:
Uncaught Error: [$injector:modulerr] Failed to instantiate module MIS due to:
Error: [$injector:modulerr] Failed to instantiate module schemaForm due to:
TypeError: Cannot read property 'parse' of undefined
So I looked around for the answer, and found a working Plunk. As I was adapting it to better show my situation, I noticed that when I removed Object-path.js the plunk got my same error.
I went back the Angular Schema Form docs to see if I had missed it being required, but can't find any mention of it.
Is there something that would tell me about the required dependencies?
OR
Does ASF not require Object-Path, and I'm doing something else wrong?
Again, here's my plunk, if you comment out the Object-Path script you can see what I mean.
#travis-heeter you can find a list of dependencies in the package.json file. It lists "objectpath": "^1.2.1" as a dependency.
The readme file also includes an example header in the script loading section showing the script tags to include. This section should also be added to the docs for people who go to the docs directly.
In the alphas for version 1.0.0 the objectpath library is built into the JSON Schema Form Core library, removing it from the dependency list of Angular Schema Form itself.
Note: There are two libraries called ObjectPath the one you linked to is not the one included. The NPM entry is for objectpath while the one you linked to is object-path with a hyphen.

Ionic 2 angular-2-in-memory-web-api 404 error

I've been developing a simple app in Ionic 2 and I tried using mock service (in-memory web API) for fetching data as described in this Angular 2 tutorial. My console reported this error:
TypeScript error: app/app.ts(11,49): Error TS2307: Cannot find module
'angular2-in-memory-web-api'.
I tried this solution: angular2-in-memory-web-api 404 error. After running this: npm i angular2-in-memory-web-api --save, I was unable to find the files where I was supposed to use the code provided in the rest of the solution.
How can I fix this? Sorry if the question is not posed quite right, this is my first one. Please ask if any additional information is needed. The problem is pretty much the same as the one for which the solution was provided in the link above, except that using Ionic 2 makes the given solution inapplicable in my case. I'm don't think SystemJS is being used, please see my file structure image.
Image of my file structure.

prism5 wpf View-Switching Navigation QuickStart demo doesn't run

I'm new to PRISM, and downloaded the quickstart demos, and tried the View Switching Navigation.
i could build the solution, there is no error there, but when i try to run the application it gives error that cannot load CalendarModule.dll.
An unhandled exception of type 'Microsoft.Practices.Prism.Modularity.ModuleTypeLoadingException' occurred in Microsoft.Practices.Prism.Composition.dll
Additional information: Failed to load type for module CalendarModule.
Error was: Could not load file or assembly 'ViewSwitchingNavigation.Calendar.dll' or one of its dependencies. The system cannot find the path specified.
i've got this error at bootstrapper.run()
thanks for any hint!

Error: [$injector:unpr] Unknown provider: $$rAFProvider

Using Karma to test Angular getting error:
Error: [$injector:modulerr] Failed to instantiate module ngMock due to:
Error: [$injector:unpr] Unknown provider: $$rAFProvider
Angular mock, Angular versions error?
I've heard solutions detailing changing of angular-mock version or angular version--which seems like a bad idea since I'd like to test on the same version as the app starts with.
Anyone else have an error like this?
Please check your angular version.
Your angular version and angular-mock version must be same.
To download angular-mock go the below link and replace the X.Y.Z with your angular version and save it
http://ajax.googleapis.com/ajax/libs/angularjs/X.Y.Z/angular-mocks.js
for example my angular version is 1.2.9
This work for me .
This issue was resolved by making sure the rails asset pipeline, which provides the angular-related assets in my case, was correctly serving assets during testing.

Resources