I'm working on a React app and trying to use the i18n-iso-countries package to get a countries object in English which has keys as iso codes and values as the country names. This is easy in node, as I've verified with a simple script running the way the i18n-iso-countries npm docs show, like this:
const countries = require("i18n-iso-countries");
console.log(countries.getNames('en'));
But when I do this in my react app (made with create-react-app) like this ...
import countries from "i18n-iso-countries";
console.log(countries.getNames('en'));
...I get an empty object back. When I log just countries (console.log(countries)) in React, I see the function "getNames" on it and the other functions the docs mention, so I'm not sure what gives.
Just needed to add this line!
countries.registerLocale(require("i18n-iso-countries/langs/en.json"));
Not sure why this needs to be added in React (and Angular - where I found answer How to use i18n-iso-countries in Angular 6 - and probably other ui libraries/frameworks) so if someone could explain that, that would be cool, but hey, at least it's working!
It is a little bit to late. But to answer jupiterjelly this line is needed for browser environment, so that your bundler knows that it needs to put this file in the bundle
Related
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 am trying to get a custom component working in Formio.js. I would love a complete, nontrivial working example.
I am not using angular, ng, react or the form.io service.
The documentation is terrible. I can copy out the Checkmatrix example code and run it (after much fiddling) but even it doesn't work correctly: in the formbuilder, the edit and delete controls don't show up. (There an bug issue open on this, but no resolution, which is distinctly worrisome.)
There are dead links all over the SDK reference documentation.. like for example for "Component" which seems particularly important.
There is no documentation of any of code used by the example. For example, it uses the 'renderTemplate' call, but the arguments are not described anywhere.
It appears that the only way to understand any part of this system to try to figure out all of the source code. There are no instructions for adding code.
It's not even clear what the best way to proceed is: whether I should fork the formio.js repo, learn TypeScript, and add components directly (creating a hassle if I ever want to keep formio.js up to date) or continue trying to work by registering components from add-on scripts in the browser.
** Can anyone give concrete advice on the best way to go? **
#nathaniel Tagg I couldn't find form.io proper form examples, so i would like to see your form.io examples if you are like to provide. Here is my email 'udara#staff.medicalwizard.com.au'
https://www.reddit.com/r/Clojure/comments/4el0xi/how_to_use_an_existing_reactjs_component_with/
There is this existing post about using existing ReactJS components in a CLJS/Reagent project. I'm looking to do the opposite. I have a bunch of CLJS components and would like to compile them into a ui library of some sort so that they can be used by React developers. That is, if I have a button CLJS component, I would like to be able to render that Button using < Button /> or mylib.Button(_) etc.. in a React/js app file.
I have read this - https://shadow-cljs.github.io/docs/UsersGuide.html#target-node-library - extensively but it's not quite working out. I've been using ":target :node-library" and I can get simple functions (that return strings/numbers, for example) to compile and work in my app, etc.. but it doesn't work for entire components. For example, my cljs button component takes in :
defn button [props & children]
but when I try to pass in these parameters (I call {lib.button({}, {})} in my App.js file), I get errors like "No protocol method IMap.-dissoc defined", because I'm trying to pass JS objects into CLJS-only functions, I believe. Not sure how to resolve this..
I can explain more on this if it would help clarify. It would also be super helpful if anyone had a reference demo project or any resources they could link me to.
I only have a few suggestions:
You can try to build a new sample project to consume your library with lein new figwheel myproject and use JavaScript interop to move one step at a time closer to the native JS way of using your library.
You can create an interface namespace that can consume JS objects and wrap these into Clojure data structures to sort out the protocol errors you're seeing, eg. functions that take a props parameter and pass down (js->clj props) to the rest of the code underneath.
For the authoritative source, check the Reagent docs, especially this: http://reagent-project.github.io/docs/master/InteropWithReact.html#creating-react-components-from-reagent-components
I'm using the Boundless sdk suite to develop a complete web application, which until now worked pretty well. However, following the Opengeo documentation
(http://suite.opengeo.org/opengeo-docs/webapps/gxp/viewer/locale.html) changing the locale of the viewer, does not work for me as the documentation is unclear to me where to put the following statement:
GeoExt.Lang.set("fr");
So far everything I changed, I did in the app.js file. As the documentation states I should find the code block:
Ext.onReady(function() {
but it does not say where it actually is. It's not in app.js, so I derive it has to be somewhere else. Once I started tempering with the various geoext/ext extensions I messed up my application.
The only way I am able to find the upper statement in app.js, is when I proceed to the next step (packaging the app), unpack the war file, and search for it in lib/app.js. But I cannot imagine this to be the solution.
I can't believe no one has asked this question before. Is it so obvious, or am am I just slow on the uptake?
I resolved the issue. It was actually quite simple.
The GeoExt statement must be in between your dependencies and the var app code block (in the app.js configuration file).
.
.
* #require locale/es.js
*/
GeoExt.Lang.set("es");
var app = new gxp.Viewer({