I'm quite new to javascript and jsfiddle. I've been able to toy around with other fiddles that I find, but setting one up myself has proved difficult.
I'm attempting to use a library from npm to get a proof of concept for how it might work. I'm not sure why my import of the module is not working with jsfiddle.
What am I missing to get my fiddle working?
used the resourced bar to import the unpkg script
https://unpkg.com/browse/json-query#2.2.2/index.js
tried using the method outlined in the package readme
var json = [...]
jsonQuery('[DisplayText]', json)
When I follow the unpkg link I see that it has requires such as:
var State = require('./lib/state')
The problem is not only can the browser not understand require, it doesn't have files like ./lib/state available.
I think the problem here is that you are trying to download the raw source, which needs to be built with something like webpack before it can be used in the browser.
I'm trying to work with this react-native library, and in the documentation it says this:
Initialize Library
Somewhere high up in your project and way before calling any other method exposed by this library, your index file or equivalent is a good spot, ensure you initialize the library with your public key as follows:
import RNPaystack from 'react-native-paystack';
RNPaystack.init({ publicKey: 'YOUR_PUBLIC_KEY_HERE' });
How do I do this, without getting null object is not a function.
In my app.js I tried it with useEffect, tried with componentwillmount , tried several ways, same error.
I feel I'm doing it wrongly.
Can someone tell how to initialize a library properly in react native.
Thanks :)
This is most likely happening because you haven't linked the native modules properly. That's expected as you mentioned you're using Expo, which doesn't allow you to add custom native code. If you want to use this library, you'll have to eject from Expo. See the docs.
I've got a little project running that uses Babylonjs to render a game, I've got the game 'rendering' and am happy with the progress and have decided to add physics, I went with oimojs as its the standard and was informed that 'enabling' it was as simple referencing the oimo.js file and calling:
scene.enablePhysics();
But when I call this I get the following error:
babylonjs.js:20 Uncaught TypeError: OIMO.World is not a constructor
The only thing I can think of is if the error is perhaps the file I'm referencing is the incorrect one? I pulled the file from:
http://lo-th.github.io/labs/
Is there something new you have to do now? Am I missing something? Or am i just silly and referencing the wrong OIMO.js file?
This seems to be a very old question (and I wonder how I missed it so far), but just for future reference -
Babylon.js has the oimo.js version that is tested and working directly in the repository. If you look here - https://github.com/BabylonJS/Babylon.js/tree/master/dist , the Oimo.js file you see there will work the the latest Babylon version.
So reading another article and solution here I found the library Alasql which seems to do what I need.
I've installed it and was writing a proof-of-concept application to use it and when I attempt to use the illustration given in that article I get:
Error: jszip is not a constructor
write_zip#https://server:8443/vendor/js-xlsx/dist/xlsx.js:11295:12
write_zip_type#https://server:8443/vendor/js-xlsx/dist/xlsx.js:11407:10
writeSync#https://server/vendor/js-xlsx/dist/xlsx.js:11421:1
saveWorkbook#https://server:8443/vendor/alasql/dist/alasql.js:15656:17
doExport#https://server/vendor/alasql/dist/alasql.js:15556:3
alasql.into.XLSX#https://server/vendor/alasql/dist/alasql.js:15529:3
anonymous#https://server/vendor/alasql/dist/alasql.js line 7343 > Function:1:14
queryfn3#https://server/vendor/alasql/dist/alasql.js:6528:13
queryfn2#https://server/vendor/alasql/dist/alasql.js:6274:9
anonymous#https://server/vendor/alasql/dist/alasql.js line 7757 > Function:1:57
queryfn/<#https://server/vendor/alasql/dist/alasql.js:6223:12
queryfn#https://server/vendor/alasql/dist/alasql.js:6219:2
yy.Select.prototype.compile/statement#https://server/vendor/alasql/dist/alasql.js:7352:14
alasql.dexec#https://server/vendor/alasql/dist/alasql.js:4240:27
alasql.exec#https://server/vendor/alasql/dist/alasql.js:4190:10
alasql#https://server/vendor/alasql/dist/alasql.js:121:11
Index#https://server/app/states/index/index.controller.js:20:23
And those errors keep going as is the custom of Angular.
Looking for a solution I found https://github.com/SheetJS/js-xlsx/issues/184 but that didn't seem to help me out at all.
So I'm wondering if other people have encountered this and what their solution to the problem was as I'd really like to use this library but can't even get their example code to work.
EDIT:
So for those who might be coming up with the same problem...the solution I found was to add the JSZip library to my application (even though it looks like it was included with the SheetJs library) and made sure it was loaded before the Alasql piece. That seems to have done the trick...
It seems you are using it with requirejs or some dependency library
You will either need to include all .js files with the distribution or add them as a dependency in shim
I'm having a hard time trying to pinpoint which, of the very many, methods I have in my angular app that would be causing the error:
Uncaught Error: [$injector:unpr] Unknown provider: nProvider <- n
This only happens once the javascript has been bundled & minified by ASP.Net.
I have ensured that all the controllers, and any other DI, is using the minification-safe method, I.E My controllers/service etc are using the method:
appControllers.controller('myCtrl', ['$scope', function($scope){
//......
}]);
I've gone through every JS file in our app - there are a lot... and can't find anything that violates this way of injecting dependencies - though there must be one somewhere...
Is there a better way to pinpoint which method could be causing this error?
Thanks
For anyone else struggling with this problem, I found an easier solution. If you pull open your developer console (on chrome) and add a breakpoint where angular throws the error:
Then, on the stack trace on the right, click on the first "invoke" you see. This will take you to the invoke function, where the first parameter is the function angular is trying to inject:
I then did a search through my code for a function that looked like that one (in this case grep "\.onload" -R public), and found 8 places to check.
For anybody reading this, using Angular 1.3
You can now use Angular's ng-strict-di check like this:
<div ng-app="some-angular-app" ng-strict-di>
...
</div>
This will give you an appropriate error message if you didn't load your dependencies using the array syntax.
I had the same problem and I found a solution that could be helpful for the rest. What I propose is basically what I saw in the comments and docs. If you are using Angular 1.3.0 or above, you can use this:
<html ng-app="myApp" ng-strict-di>
<body>
I can add: {{ 1 + 2 }}.
<script src="angular.js"></script>
</body>
</html>
In my case, I have everything within a file app.js so the only thing I need to do for finding my DI problems is to add this little code at the end:
angular.bootstrap(document, ['myApp'], {
strictDi: true
});
It's better documented in Angular Docs
I hope that helps. Good luck!
As mentioned in the comments, These are the steps I took to try and find my JS error.
If there is another, easier, solution, please feel free to post it and I may mark it as accepted.
Trying to debug minified code is a nightmare.
What I eventually did was copy my minified javascript, directly from the inspector in Chrome.
I then pasted the JS into http://www.jspretty.com/ - I had tried http://jsbeautifier.org/ but found their site froze with such large JS code.
Once it was 'pretty-fied' I created a test.js file in my solution and pasted the, now easier to read code, into it.
Quick step to comment out the #script tag in my _layout and add a link to the test.js file and I was ready to debug a now, far easier to read, chunk of Javascript.
It is still pretty awkward to traverse the call stack, though now you can see actual methods it makes it far less impossible.
Something that helped me solve this (finally!) was actually already in the angular docs! If you add the ng-strict-di attribute to your code wherever you define your ng-app, angular will throw a strict warning so you can more easily see what's going on in development mode. I wish that was the default!
See the argument list at the bottom of the ngApp docs.
https://docs.angularjs.org/api/ng/directive/ngApp
The way this works for me is the following:
1) have two test specification html files (unit test) minimized and plain
2) make sure the bundling of the files are in the same order as the plain spec file (JS script reference)
3) make sure to explicitly declare all dependencies (array or $inject declares see http://www.ozkary.com/2015/11/angularjs-minimized-file-unknown-provider.html)
When there is a mistake on the unit test (miminized reference) file, I can compare and make sure the reference of the files is in the correct order as the working file.
hope that help.
I had the similar issue and used lots of time to investigate and figured out it was the Chrome extension Batarang that was injecting the bad code and error in Angular looked exactly the same. It's really a pity it's so hard to find what exactly is causing the problem.
I had the similiar issue too. The solution is exacly the answer from ozkary point 3, that is to make sure to explicitly declare all dependencies including "resolve" part of your route.
Below is my code.
when('/contact/:id', {
controller: 'contactCtrl',
templateUrl: 'assets/partials/contact.html',
resolve: {
contact: ['ContactService', '$route', function(ContactService, $route) {
return ContactService.getContactDetail($route.current.params.id);
}]
}
})
For those who's bootstrapping their angularjs app.
angular.bootstrap(body, ['app'], { strictDi: true });
Don't forget to debug in non minified code and you should be able to figure out pretty quickly the malformed dependency injection.
The malformed injection is usually formatted like this :
...
.run([ function(ServiceInjected){
...
But should look more like this
...
.run(['ServiceInjected', function(ServiceInjected){
...
This is tested in angularjs 1.7.2