Using require() calls in the console - browserify

I am using Browserify to build a react app where I am using CommonJS modules. When testing the app, I would sometimes like to have access to some module in the build, but whenever I try to use require from the console in Chrome it fails.
require('react-router')
Uncaught Error: Cannot find module 'react-router'
Is there a way to require modules dynamically?
Of course, I understand I can only require modules that have been built into the bundle by browserify ...

Related

InView package not working in react native typescript mobile app

In my TypeScript React Native mobile app, I'm trying to detect elements appearing on the screen. I'm trying to use many packages such as react-native-inview and react-native-component-inview but they keep throwing typescript typing related errors. How can I resolve these errors or is there other ways or packages available which are typescript supported?
Error:
Could not find a declaration file for module 'react-native-inview'. 'PATH/node_modules/react-native-inview/index.js' implicitly has an 'any' type.
Try `npm i --save-dev #types/react-native-inview` if it exists or add a new declaration (.d.ts) file containing `declare module 'react-native-inview';`
Note: The automatically specified type packages do not exist such as npm i --save-dev #types/react-native-inview.
It seems you didn't add these packages correctly to your app. Have you tried pod install command in your ios folder? If it is not the case, I recommend refreshing your node modules in your app directory.

webpack + babel, transpiling dependencies

I'm creating an app made with vuejs. This app i using AWS Appsync services for communicating.
Unfortunately i need to support old browsers like ie 10/11 and the module developed by amazon aws-mobile-appsync-sdk-js and other sub dependencies are build using es6.
So, i have tried to transpile dependencies using webpack and babel but when i run app in any browser (ff, chrome too) i got this error: exports is not defined.
Is refereed to a row of a dependency how i have tried to transpile
node_modules/aws-appsync/node_modules/debug/src/browser
exports.log = log;
Any ideas? Thank you
I think your code should be module.exports.log = log instead. At least according to this article.
Or if you want to use ES6 native exports: export {log}.

React native source not compiling correctly when using mocha + babel

Im having a bit of an issue after upgrading to React Native 0.30. Using mocha, and babel I transpile the react native source before test run. I'm now seeing issues where modules cannot be found.
Here's an example:
Error: Cannot find module 'AssetRegistry'
The corresponding file can be found here https://github.com/facebook/react-native/blob/master/Libraries/Image/AssetSourceResolver.js#L21. It looks as if babel cannot locate the AssetRegistry file that is local in this directory.
Ok so it turns out that react-native-maps was calling an internal react-native library. react-native-mock has most of the internals mocked for react native however the internal library for the Image utility was not mocked.
I just used mockery to mock the library and all seems to work now.

React Native Android Release APK

I'm trying to run a release APK.
I download the bundle just fine, I create the signed APK via Android Studio, and I install it via adb install.
When I run the app, in log cat I see:
Got JS Exception: SyntaxError: Unexpected keyword 'const' Const declarations are not supported in strict mode
and
Got JS Exception: ReferenceError: Can't find variable: require.
I thought RN was transpiled via babel. What gives?
I had a similar problem.
Solved it by upgrading node to 4.2
I just tried this now.
In 'use strict' mode you can specify const properties. There is no impact in the release APK build.

Using npm modules in React Native projects

Is it possible to use npm modules with React Native projects directly, like one uses them within a React project by npm install <module-name>?
Of course I mean modules that can be used with a React app, that is front-end ones that will be run in the browsers JS runtime but not in the nodejs or iojs runtime as a React Native app does not run in the nodejs or iojs runtime.
Well, it's quite opposite. React Native actually runs within io.js runtime so most pure javascript modules for node will work. On the other hand most front-end modules written for React.js will not work for React-Native.
React Native does not use HTML DOM nor CSS as we know it from the web. It replaces the CSS/HTML DOM with the native view representation. So any front-end packages that are supposed to use HTML and be displayed in browser will not work.
On the other hand, any modules that are pure javascript and run within node.js/io.js are perfectly OK to be run in react-native.
For example, I am quite sure that Facebook uses their 'relay' data access library in their react-native apps (it's a javascript library that efficiently communicates over Facebook's Open Graph API and allows to access Facebook user's data).
The way to do it is the same as in other node.js/io.js apps. Simply run
npm install module --save
and you are done (package.json will be automatically update with the dependency for the module). Then you can use the package as usual.