Trying to use the Angular $resource, and its coming back as not a method. Looking through the sparse documentation, I was able to find this :
angular.module('productServices', ['ngResource']).
That you're supposed to include it in your app module. Fair enough, I throw it in and get :
Uncaught Error: No module: ngResource
Hmm.. does this not come with Angular.js and its a separate plugin?
It's a separate file that you'll need to include in your project, as of version 1.0.0rc3 (see changelog on GitHub).
Head over to http://code.angularjs.org -- under the folder for any version after this release, you should see the angular-resource.js file available for download and inclusion in your project.
Related
I have pretty strange problem with webpack and aurelia.
I've made new webpack configuration based on the internet and in official webpack and aurelia documentation. Compilation works, everything seems to be fine. But in runtime, I'm getting this error:
css-resource.js?ada4:17 Uncaught (in promise) Error: Failed loading required CSS file: aurelia-notify/style.css
at fixupCSSUrls (css-resource.js?ada4:17)
at eval (css-resource.js?ada4:56)
at <anonymous>
Originally, I thought it might be some issue related to this comment:
// CSS required in templates cannot be extracted safely
// because Aurelia would try to require it again in runtime
mentioned here: https://github.com/aurelia/skeleton-navigation/blob/master/skeleton-typescript-webpack/webpack.config.js#L70 but it doesn't seem to be.
While creating working example, I made a strange discovery. Everything works, until I load one of CSS files from following dependencies:
<require from="aurelia-bootstrap-datetimepicker/src/bootstrap-datetimepicker-bs4.css"></require>
<require from="eonasdan-bootstrap-datetimepicker/build/css/bootstrap-datetimepicker.min.css"></require>
(Please not the dependencies and error message - they are completely unrelated).
Here is example repository: https://github.com/klinki/aurelia-webpack-issue
(also have a look at tag working-state: https://github.com/klinki/aurelia-webpack-issue/tree/working-state - only one commit back and it works).
I fixed your problem:
new ModuleDependenciesPlugin({
'aurelia-testing': [ './compile-spy', './view-spy' ],
// 'aurelia-notify': [ './style.css' ]
}),
First this is not needed because AureliaPlugin installs a loader by default on all HTML files to detect and process <require> dependencies. style.css is required from an HTML template somewhere inside aurelia-notify. This is handled for you, no config required.
Second this was bad because the rest of your config is set up with appropriate loaders based on whether the CSS dependency comes from inside a .html (assuming an Aurelia <require>) or not (assuming a JS import).
By using ModuleDependenciesPlugin in this way, Webpack did not see a .html origin for the dependency and incorrect loaders were applied.
I'm trying to add vis.js to a 4-year-old web application.
When I run the application without packaging everything, it works. However, when I package everything with grunt, I get the following error in the browser's console:
Mismatched anonymous define() module
When I comment out the code
require(['vis'], function(vis)) { ... }
The error disappears, but obviously I don't have any access to vis any more.
I seem to be doing everything that is shown in the example , with the exception of using data-main when loading require.js. That's because it is no longer supported by use-min.
I had the same issue with other library (NanoModal). The only solution which worked for me was to exclude that library from packaging using the paths configuration of the r.js optimizer:
paths: {
"nanomodal": "empty:"
}
Scenario is,
im using following versions of angularFire and firebase in my project in index.html
<script src="https://cdn.firebase.com/js/client/2.0.4/firebase.js"></script>
<script src="https://cdn.firebase.com/libs/angularfire/0.9.0/angularfire.min.js"></script>
and angular.min.js is installed locally. IM not using AngularJS from CDN.
When I try to use $on,$once functions in my Angular project it gives me error that $on is not defined... and I am also facing error of dependency injection for using $firebaseArray,$firebaseObject even I declare firebase in my module. Here is Module declaration in my App.js file which main file and all of my controlles are in this single file
var appMainModule = angular.module('appMain', [ 'firebase','ngRoute'])
If I upgrade my versions to latest as shown in following links
[(https://www.firebase.com/docs/web/libraries/angular/quickstart.html)]
Then I face error that firebase has been removed, you may instantiate $firebaseArray,$firebaseObject directly...
Help me to solve my issues,
I'm inspecting this Webpack demo project https://github.com/Foxandxss/GermanWords-ng1-webpack. This project contains in several files this line (features/home/index, features/login/index):
import angular from 'angular';
I don't understand - if 'angular' library will be included several times in result js file because this library exists in several source files? I've looked at webpack config file, but can't understand. Please, can you clear this questions?
It's just to be sure that angular will be available for every module. Imagine you use a feature to be a new standalone site, you will have already the code ready. Always think like every feature is a standalone (handle routes, dependencies, controllers, views etc.).
Webpack will handle the dependencies and inject only once angular, dont worry. Like #thsorens says in comments : "All dependencies in your files needs to be imported where it is used."
Oh and for furthermore, i've found this yeoman generator base on Foxandxss work : https://github.com/Aleksion/generator-angular-webpack-babel
Have fun.
I'm getting an error logged to the console:
GET http://localhost:3000/js/lib/angular/MINERR_ASSET 404 (Not Found)
I saw this post and it said it was a result of not inculding ngRoute module, but I do!
public/js/app.js:
window.app = angular.module('mean-blog-seed', ['ngCookies', 'ngResource', 'ui.bootstrap', 'ngRoute', 'mean-blog-seed.controllers', 'mean-blog-seed.services']);
Then I have a jade file that references angular-route.js:
script(type='text/javascript', src='js/lib/angular/angular.min.js')
script(type='text/javascript', src='js/lib/angular-route/angular-route.min.js')
script(type='text/javascript', src='js/lib/angular-cookies/angular-cookies.min.js')
script(type='text/javascript', src='js/lib/angular-resource/angular-resource.min.js')
script(type='text/javascript', src='js/lib/angular-bootstrap/ui-bootstrap-tpls.min.js')
script(src='js/app.js')
script(src='js/config.js')
script(src='js/services/global.js')
script(src='js/controllers/posts.js')
script(src='js/controllers/header.js')
script(src='js/filters.js')
script(src='js/directives.js')
The repo is here
Update:
I posted the issue on github and got referenced to this crazy answer: https://github.com/angular/angular.js/issues/4675
The ng-closure-runner runs an angular specific pass during compilation
which adds a definition for MINERR_ASSET, that asset is not included
with any of the 1.2.x releases (the only releases with source maps).
However, the source map references MINERR_ASSET as a source and as a
result there is a 404 when requesting the file.
I've only quickly glanced at the grunt tasks and also
ng-closure-runner, but I'm under the impression this is likely the
ng-closure-runner included minErr.js or some file generated based on
it. Either way the correct asset should be packaged with the other
source files or MINERR_ASSET should be removed from the source map
"sources".
https://github.com/angular/angular.js/issues/4675
The above code led me to check out that problem and you are getting a call to ng-closure-runner (here: https://github.com/angular/angular.js/blob/a29bff1c98161495fb304d0195c4d2916b357686/bower.json).
Try including minErr.js in your JS files.
Recently I noticed that in Safari I was getting the same error.
"sources":["angular.js","MINERR_ASSET"]
to:
"sources":["angular.js"]
and added non minified version of angularjs files associated with minified version to fixed the console errors. If you are using production version of angularjs, which should be minified version, make sure you add map associated with the library files or you may have unwanted server errors.
in the .map file, I changed
"sources":["angular.js","MINERR_ASSET"],
to :
"sources":["angular-sanitize.js"]
no longer getting error in console.
I also faced this issue once, make sure you have all three files :
angular-route.js
angular-route.min.js
angular-route.min.js.map
in your library/vendor folder.
and your app definition contains ngRoute :
var myApp = angular.module('myApp',['ngRoute']);
Please vote if this resolution helps you. or share your app.js/error if you still have this issue.
Thanks