ngMaterialDatePicker Dependency injection fails during gulp serve:dist - angularjs

I have used ngMaterialDatePicker which works fine in dev mode but when I tried to run using gulp serve:dist I am getting the below mentioned error can anyone tell me why it has a strange behaviour like this:
Error:
Module 'ngMaterialDatePicker' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.

Probably the problem is in uglyfing js code, do you use ng-annotate or babel plugin for build command?

Related

Grunt Build creates broken app

I've made an AngularJS web application using Yeoman as project starter.
Launching the following command:
grunt serve
everything is working fine.
If I try to test the dist version for production, using the following command:
grunt serve:dist
I get erorrs like this in browser console:
vendor.f13d432c.js:1 Uncaught Error: [$injector:modulerr] Failed to instantiate module myApp due to:
Error: [$injector:modulerr] Failed to instantiate module uuid4 due to:
Error: [$injector:nomod] Module 'uuid4' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
What's wrong?
EDIT
Same happens with:
grunt build
and then deploy the dist folder in a webserver
Have you tried running:
npm install
Apparently, 'uuid4' is missing. This is a npm package so chances are you still need to include this, running npm install.

How to include a dependency that is not an angular module in gulp-Angular yeoman generator?

I'm using a yeoman generator called "gulp-angular", I'm trying to add a dependency that is not an angular module, this dependency is a jquery plugin. I include this dependecy with: bower install depdency_name --save" but when I try to use it, I get an error, this error is a 404.
For a concrete example: I'm trying to include this dependency: blurry-image-load
So, when I want to include something dependency that is not an angular module, what I need to do, to make it work?
Thanks for your time
This is probably happening because the module you are trying to get isn't available in Bower.
You can however specify a full URL in Bower instead of a Bower package name. The URL should point to the main JavaScript file in their GitHub repo.
PS don't forget to add the script tag in the head of your HTML file.

Missing modules after fresh generation with Yeoman's angular-fullstack

So, I generated a fresh angular-fullstack with TypeScript, MongoDB, Bootstrap, Bootstrap UI, Authentication Boilerplate, Twitter and Google OAuth, Grunt, Jasmine, HTML, CSS, and UI-Router for the settings.
After I ran npm install and bower install. There were some unmet dependencies, so I installed
TypeScript, locally
Mocha, locally
Tslint, locally
Also, I was getting an error during build that was resolved by installing
grunt-babel#5.0.0, locally.
Now, when I run "grunt serve" It all works just fine, except when I go to the Admin page at http://localhost:9000/admin. There is no list of users. Instead it says, "The delete user and user index api routes are restricted to users with the 'admin' role." All of the links on the navigation bar are dead, except for the app title.
When I check the console I get these two errors:
Uncaught Error: [$injector:nomod] Module
'perfectAlgorithmDrillsApp.auth' is not available! You either
misspelled the module name or forgot to load it. If registering a
module ensure that you specify the dependencies as the second
argument.
Uncaught Error: [$injector:nomod] Module
'perfectAlgorithmDrillsApp.admin' is not available! You either
misspelled the module name or forgot to load it. If registering a
module ensure that you specify the dependencies as the second
argument.
I triple-checked. They are not misspelled and they are correctly included in the list of module dependencies.
Further errors arise because the module isn't loaded. Obviously, it can't find the controllers, since those modules aren't loaded.
At this point, I have not added or changed any code.
I've tried a couple things to resolve the situation:
updating yo and angular-fullstack and then recreating the project from scratch.
wrapping those "missing" modules in IFFE's.
I updated node.js to the latest LTS version
More Details:
I am running everything on OSX El Capitan 10.11.2
I'm running node version 4.2.6, npm version 2.14.12, yeoman 1.6.0
in the yo.rc file it says the generator version is "3.3.0-beta.0"
I have mongod running.
I'm doing my work in WebStorm, but I haven't used anything that's built in. It's all been command line.
The TypeScript is being compiled correctly, as the .tmp directory looks good.
I made sure grunt-cli is installed.
Thanks so much for the help. Let me know if you need any more details.
I too had this exact problem. The long answer (plus some other answers to questions you might not be asking for yet or possibly ever) is here, but in short, replace var module = /\.module\.js$/; with var module = /[\w/]+.module.ts$/; inside Gruntfile.js.
If that doesn't work, try going here to see the whole thread on this issue.

Grunt Error Cannot find module 'win-spawn'

I just installed Generator-ionic
in the folder where i genrated the app im trying to run grunt server
i get this error Error: Cannot find module 'win-spawn'
Not sure why the dependency is not being met, but it happened here too.
Solution:
npm install win-spawn
Edit:
Generator-ionic team is aware of the issue: https://github.com/diegonetto/generator-ionic/issues/162

Using browserify-shim to browserify Foundation for apps

I've been trying to user browserify with Foundation for apps, which was recently added on npm (version 1.02). Since the npm package from foundation-apps is not commonjs compatible I've decided to use "browserify-shim"
The difference between the bower component and npm package of foundation for apps, is that the former comes with all the dependencies included (angular, ui.router, angular-animate etc), while the npm version comes only with the absolutely necessary stuff (foundation core, components and services).
I installed angular and angular-animate from npm, and shimmed them (npm versions of angular/angular-animate are also not in the commonjs format). As for ui.router, the npm package supports commonJS, so no need for shiming.
This is my package.json
and this is my main.js (app entry point)
Browserify successfully creates a bundle.js file, that includes everything (foundation.core, components, services as well as angular, angular-ui-router and angular-animate)
But my app instantiation fails with this message:
Uncaught Error: [$injector:modulerr] Failed to instantiate module myApp due to:
Error: [$injector:modulerr] Failed to instantiate module application due to:
Error: [$injector:modulerr] Failed to instantiate module foundation.dynamicRouting due to:
Error: [$injector:nomod] Module 'foundation.dynamicRouting' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
http://errors.angularjs.org/1.3.8/$injector/nomod?p0=foundation.dynamicRouting
Any ideas what might be the case? I'm suspecting there's a dependency somewhere that didn't catch my attention, or perhaps something I messed up in package.json

Resources