Making a JavaScript file not required in production environment

Question

I have a large ASP .NET web application that I am integrating with AngularJS. I am trying to re-structure the directories to reflect a more standardized Angular file structure, but I am running into a problem when it comes to trying to make this transition without breaking our production site.

We use the Kentico CMS to render our pages and therefore it is also used to fetch application wide JavaScript files in the <head> tag. The problem is that I cannot add the new JS files into Kentico without the production version breaking because the JS files do not exist in production, they only exist on my local environment until we make a production build. Therefore I was wondering if there is a way to make a JavaScript file include optional and therefore not break the page and cause JS errors?

This way, I can add the files in Kentico and continue developing locally without breaking the production site.

Why in the world is your production and dev environments linked? Shouldn't you have a dev version of the software? — epascarello, Aug 26 '14 at 17:06

score 0 · Answer 1 · edited May 23 '17 at 12:13

what you need are two things

some indicator telling angularjs that its running in prod/dev.
directive which does not load the javascripts if the environment is prod

you can get lot of examples of how to load scripts dynamically using directives. shortest possible example of such directive

angular.module('myModule', []).directive('loadScript', [function() {
    return function(scope, element, attrs) {
        angular.element('<script src="/path/to/my/file.js"></script>').appendTo(element);
    }
}]);

you can see more examples here and here

what you need to modify these answers is with the point-1 I mentioned. have some indicator for prod/dev environments.

Making a JavaScript file not required in production environment

1 Answers1