My company have a javascript library that contains all the core logic of our web app (written with React). This library is built using typescript and compiled down to es2015.
When adding this library to our react native app we've encountered a weird behaviour where the code works fine when running the app with the debug version but doesn't work when running release builds.
We don't understand why this issue is happening especially because we aren't writing any code in this library that we wouldn't write in the app. And we also tried to copy the code from the library to our app and it worked fine.
What can be the reason for that?
Related
I am currently working on a React Native project that uses TypeScript as the programming language. I am familiar with using Emmet in my text editor for web development and would like to know if it is possible to enable similar functionality for React Native development with TypeScript.
I have managed to make Emmet work for normal react but not react native because it isn't normal JSX.
Are there any specific plugins or configurations that I need to be aware of to enable Emmet support for React Native development with TypeScript?
I imported this library https://github.com/THCLab/oca.js-form-core in my React Native project but I get an error when instantiating const ocaJs = new OcaJs({});:
Error: Automatic publicPath is not supported in this browser, js engine: hermes
The library is Node.js compatible (there is an example in the Github repository). However, it is packaged (npm) with webpack and I believe that the React Native project uses this package for import. That's the problem (i think - i'm a beginner in React Native). There are references to the DOM added by webpack. Is there any way to force the use of the Node.js build instead?
Have you tried specifying the publicPath explicitly as discussed in the answers to this question?
In general however, because React Native does not contain all the Core Node JS Modules, many libraries which are compatible with Node.js require polyfills to work in React Native. You can attempt to make a polyfill yourself by following a guide such as this. I have experienced mixed results with such methods, but I am far from an expert. From my experience, trying to create a polyfill can be a time consuming venture to pursue, and I would recommend first exploring whether or not a React Native library exists which can help you accomplish your objective.
I am trying to develop a Cordova based app that uses the ytdl-core node module. From my understanding, Cordova uses node-js for running the app on osx (or other non-browser platforms). The app builds successfully and it opens on my Mac, but the javascript won't work since it throws this error on open and/or refresh:
"modify in config.xml.
2020-05-23 20:11:32.639 Weather[11707:374910] JavaScript error: index.js:11: ReferenceError: Can't find variable: require"
index.js:11 is this line: const ytdl = require('ytdl-core');
Most people with this error are getting it because browsers do not support "require", but as I said, I'm running on osx platform. I already checked that node.js is installed and the ytdl-core is in the node_modules folder of my project.
Here is my git repository: https://github.com/FCjosh/JRMusicapp.git
I installed cordova exactly as it says on their website with xcode. One more thing worth mentioning is that I am using Jquery although I don't think that is problematic with node.js.
UPDATE
After tons of research, I have reason to believe that the reason the Javascript file cannot use the require function is because Cordova is treating it like a browser would. I have three ideas for solutions that may or may not work:
Cordova Plugins - A plugin runs natively and perhaps some sort of nodeJS plugin specific to the ytdl dependencies could be made.
Browserify, Webpack, or the like. From my understanding, these let you run serverside code on a browser. This seems pretty straightforward and a likely to work solution.
Create a native app and embed cordova. I don't know how to make a native app and if I did, I wouldn't be using Cordova. So I will not pursue this option, but I could understand situations where embedding Cordova in a native app is very useful.
I began making a plugin, but I got stuck when I got to the Objective C part and I have no idea how to implement nodeJS into the plugin. I am changing routes to the Browserify/Webpack solution because the plugin is over my head and making a native app is also over my head.
I will update again soon if the Browserify/Webpack solution works.
I was wondering if there is a way to use NPM packages in Android project with Kotlin. I know there is a Gradle plugin kotlin.js and it seems to work with a standalone project like a demo provided by JetBrains, but when I try to use it with Android I get this error:
Cannot add extension with name 'kotlin', as there is an extension already registered with that name.
There is even a little tutorial on how to setup kotlin/js, also provided by JetBrains, but there is nothing new.
I'm asking because I want to start a little multiplatform project, but the core part of it is a library, which I had written some time ago, but it is in Java, and it is heavily dependant on BouncyCastle and some other libraries that handles XML serialization, so there is no luck with that. But I found a similar library in JavaScript. And since I can not use any Java dependency with kotlin/multiplatform there are two options for me, either find a way to make Kotlin/JS work with Android project or move on to React-Native, which I like, but I would prefer Kotlin.
Well, this might be a silly question but I want to clarify the reason.
React-Native imports nodeJS libraries, so I think it is possible to use reactJS library as well though reactJS includes pure html components.
Can react native recognize reactJS components including html?
react library actually does not have anything related to Browser DOM HTML. Anything related to it separated into react-dom package. React Native does not and cannot use this library, because you don't have DOM underneath a react native application. However you can use most of the code/functionality you wrote for your mobile app in the browser, if you install necessary transpiling library. This is possible because react native defines some primitive components that can be ported to almost any platform.
If you still want to use just HTML to render inside react native, you may use WebView for it.
Usually libraries built specifically for other platforms will not work with React Native. Examples include react-select which is built for the web and specifically targets react-dom, and rimraf which is built for Node.js and interacts with your computer file system. Other libraries like lodash use only JavaScript language features and work in any environment. You will gain a sense for this over time, but until then the easiest way to find out is to try it yourself. You can remove packages using npm uninstall if it turns out that it does not work in React Native.
-- source: React native official docs