Something could’ve happened in the past 2 weeks while I focused on fixing my unit tests. It had been some time since I last did a local deployment. To my surprise, my local deployments in the recent days rendered a blank page with the following error in the JavaScript console:
Uncaught Error: [$injector:modulerr] Failed to instantiate module FormSG due to:
Error: [$injector:modulerr] Failed to instantiate module forms due to:
Error: [ng:areq] Argument 'directiveFactory' is required
My Google-fu was lacking. My teammate helped me find this relevant Stack Overflow thread. Below was how I’ve been implementing my directives:
'use strict';
angular.module('forms').directive('someDirective', someDirectiveFunction);
const someDirectiveFunction = () => {
...
};
There’s no function hoisting. As such, the console was complaining about the non-existence of someDirectiveFunction
. If I were to remove 'use strict'
, would the directiveFactory
error be silent?
I could have fixed the code above by moving the function definition above the call to .directive(...)
, but after seeing that the other existing directives were defined by function someDirectiveFunction() { ... }
, I decided to follow suit. Now, my code looks like:
'use strict';
angular.module('forms').directive('someDirective', someDirectiveFunction);
function someDirectiveFunction() {
...
}
I’m glad I asked and I’m fortunate to have such patient teammates.