I am a bit confused about how brunch handles modules.
Here is the only script file I have:
$(document).ready(function(){
var Backbone = require('backbone');
console.log('hi');
});
Here is my brunch-config.coffee:
http://ix.io/k3I
And my app/index.jade:
http://ix.io/k3J
The error I get is: "Uncaught ReferenceError: require is not defined"
Is it because of the module definitions?
Configure requirejs properly it should work then http://requirejs.org/docs/start.html#add
Backbone is not wrapped into require.js module, so it's not available as a require module.
Use plain Backbone global variable.
Related
I am struggling to include stomp in my project. With both versions jmesnil/stomp-websocket or the subspequent forkJSteunou/webstomp-client.
I tried to import properly:
import Stomp from 'stompjs';//or 'webstomp-client';
import SockJS from 'sockjs-client';
and to load it like:
angular.module('app', [
uiRouter, ngTranslate, ngTranslateStaticFilesLoader, ngResource, ngFilter,
uiBootstrap, Stomp, SockJS
])
But I get the following error (with both versions):
Uncaught Error: [$injector:modulerr] Failed to instantiate module app due to:
Error: [$injector:modulerr] Failed to instantiate module {"VERSIONS":{"V1_0":"1.0","V1_1":"1.1","V1_2":"1.2"}} due to:
Error: [ng:areq] Argument 'module' is not a function, got Object
(Even if webstomp.js has "function webpackUniversalModuleDefinition(root, factory) " on top, which apparently is not fullfilling its purpose)
It is possible to bypass this errors by importing it "wildly" directly on top the controllers where used, but then all karma tests are not running (error is : Error: Cannot find module "net"), even though node: { net: 'empty', tls: 'empty', dns: 'empty' } is added to webpack.config.js.
At this point anything I am trying just feels like weird black magic.
Is there a "constellation" of lib versions, angular wrappers, etc that is know to work properly with my setup (angular 1.5 / es6 / webpack 1.14 / karma) ?
Do not add it as a dependency to your angular module. The Stomp library is not an angular module. There might be a bridge available, but I don't think it is necessary.
To use Stomp with Webpack 2, simple require it at the tomp of the file where you are using Stomp and then use it as if it was a global variable.
const Stomp = require("stompjs/lib/stomp.js").Stomp;
Inside your controller/service:
Stomp.client(...);
Edit
This solution will be a bit more difficult to unit test, because you will not be able to replace the dependency easily the "angular way". To solve that issue, you might define it in your main module file as a constant and than use the DI provided by AngularJS.
Main Module File
const Stomp = require("stompjs/lib/stomp.js").Stomp;
angular
.module('app', [
// dependencies
])
.constant('Stomp', Stomp)
// other controllers/services/etc.
Controller/Service
function MyController(Stomp) {
Stomp.client(...);
}
I'm trying to get ng-file-upload to work with my angularjs project, which uses webpack. I installed ng-file-upload via npm and added it to my main app.js
var ngFileUpload = require('../../node_modules/ng-file-upload/dist/ng-file-upload.min');
module.exports = angular.module('app', [ngFileUpload])
But I'm still getting:
Uncaught Error: [$injector:modulerr] Failed to instantiate module app due to:
Error: [$injector:modulerr] Failed to instantiate module {} due to:
Error: [ng:areq] Argument 'module' is not a function, got Object
Could anyone tell me what I'm doing wrong, since I tried to find any information about this with no success.
Look for what ngFileUpload is exporting and what's the name of module. Right now you are injecting the module inside angular dependency but you need to just give name of your ngFileUpload module not the ngFileUpload it self. That's why you are getting this error. It's expecting a name of module but getting a object instead.
My problem lies here where I am trying to test a controller within angular. This is the error the console throws to me when running the command mocha --compilers coffee:coffee-script/register **/*.spec.coffee to run all testing files within the project.
angular.module('weaver.ui.app');
^
ReferenceError: angular is not defined
I recently added angular-mocks library which makes sure angular is not an unresolved variable, but this doesn't resolve the problem.
My beginning of my testing file looks like this (the code is written is CoffeeScript)
# angular = require 'angular'
angular.module 'weaver.ui.app'
chai = require 'chai'
sinon = require 'sinon'
If I uncomment the require angular the error changes into the following, so I assume this is not the right way.
\npm\node_modules\angular\angular.js:29016
})(window, document);
^
ReferenceError: window is not defined
And if I remove the line angular.module 'weaver.ui.app' completely I get a similar error but this one is about the controller.
angular.module('weaver.ui.app').controller('AppDesignSidebarNewcontentCtrl', function($rootScope, $scope) {});
^
ReferenceError: angular is not defined
I hope someeone here can help me with this problem which is bugging me for quite a while now.
Please do not judge me on the name of the controller ;)
I'm setting up a standard (but simpler) test environment for an Angular app. What I'm using is Mocha, Chai, Angular, Angular-Mocks (since that's needed unless you use Jasmine afaik).
Angular and angular-mocks are version 1.3.10, but this happens for 1.3.15 as well, these are the two versions I tested with.
The problem is that I receive this error from the js console when loading the angular-mocks script.
Uncaught TypeError: undefined is not a function
The lines it's complaining about in angular-mocks is:
(window.beforeEach || window.setup)(function() {
currentSpec = this;
});
So angular-mocks is trying to grab a global function which doesn't exist in this case, right? Why, and how do I prevent it? Is there a actual problem?
Here's a js fiddle with the code and the problem
I then get the following error when trying to use inject()
Uncaught ReferenceError: inject is not defined
Why is this happening?
I'm attempting to get a brand new Ionic project working with angular-local-storage with no luck. I'm somehow referencing angular-local-storage incorrectly, but I don't know how.
https://github.com/grevory/angular-local-storage
ionic start myApp tabs
cd myApp
ionic platform add ios
ionic build ios
bower install angular-local-storage
// app.js
angular.module('starter', ['ionic', 'starter.controllers', 'starter.services', 'LocalStorageModule'])
Then
ionic serve
Error
Uncaught Error: [$injector:modulerr] Failed to instantiate module starter due to:
Error: [$injector:modulerr] Failed to instantiate module LocalStorageModule due to:
Error: [$injector:nomod] Module 'LocalStorageModule' 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 simple thing am I missing?
I'm not familiar with ionic, but it looks to me like you're missing the script.
Are you sure that you have the script included on the page? I'd confirm that bower did indeed install the script where you think it should be and then make sure its actually referenced before this error is thrown.
Guy should need to check that have you added link to it's script
src="https://rawgit.com/grevory/angular-local-storage/master/dist/angular-local-storage.min.js"
using <script></script> tag in your index file. It might be the issue. For the guys who will see this in future.