Problem with importing SwitchSelector in React Native - react-native

I am relatively new to programming and I have some trouble with importing SwitchSelector, which I am going to use to switch language manually in my React Native app, I tried to follow this video: https://www.youtube.com/watch?v=kq9LqHKgNOA&t=47s.
I have installed it with this command: npm i react-native-switch-selector --save
And imported with this line: import SwitchSelector from "react-native-switch-selector";
But under the import line there is dotted line and when I hover over it I get this message: Could not find a declaration file for module 'react-native-switch-selector'. 'C:/Users/carol/Documents/kand_arbete/Sporta/node_modules/react-native-switch-selector/index.js' implicitly has an 'any' type.
Do anyone know how I can fix it? If not, how can I solve this with buttons instead?
I would be really grateful if someone could help me!

Related

React Native: EventEmitter.removeListener('appStateDidChange', ...) - How to debug this?

I am kinda new to React Native. I get this warning which is really annoying and spamming the console every other second or so.
EventEmitter.removeListener('appStateDidChange', ...): Method has been deprecated. Please instead use `remove()` on the subscription returned by `EventEmitter.addListener`.
How do I debug this? The call stack says MeasurementProvider, but there is no removeListener anywhere in our code. Does this warning come from a third-party module?
For some reason, I only get this warning in 1 redux slice out of many which use the exact same code structure for deleting state items... Everything works as it should besides that warning popping up so I simply removed the warning using the code below in App.js
import {LogBox} from "react-native";
LogBox.ignoreLogs([
"EventEmitter.removeListener('appStateDidChange', ...)"
])
It's no long-term solution but it'll only show the warning in your dev console this way :)

Can't import Ink interpreter with Javascript interpreter with Vue.js

I need to make a Vue.js site with a JavaScript Ink interpreter. The only one that seems to be production-ready is Ink.js. There are two ways to import it. One is in its TypeScript format, but my Vue setup does not use TypeScript. I could add it, maybe, although I'm not sure I want to. If I import the TypeScript libraries from Yarn, no matter which object I import, it shows up with a value of undefined in my code.
Then there is a pure es5 script available, that seems to be a transpiled version of the first one, but when I try to import that one, I get this error, I think from Babel:
Uncaught SyntaxError: Unexpected token '!'
cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/components/Ink.vue?vue&type=script&lang=js&:39 Uncaught SyntaxError: Unexpected token '!'
at Object../node_modules/cache-loader/dist/cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/components/Ink.vue?vue&type=script&lang=js& (app.js:962)
My guess is that Babel is set up for es6 or es7 and the pure is5 file brings up some unexpected syntax. I tried to change babel.config.js, but I've found no option that's kept Vue.js from complaining. What am I doing wrong? 
After many failed attempts, I went around the problem in the following way: I imported the Story object directly from the library:
import { Story } from '../../node_modules/inkjs/engine/Story';
// ...
let story = new Story(storyText);
I know it's not what the documentation recommends, but it works. And it seems everything else that needs to be imported is, because when I try to read story.currentChoices I get an array of Choice objects that are in turn perfectly readable.
So this works for me. If anyone else runs into this problem, I'm not saying it's the right solution, I'm just saying that's what I finally ended up doing.

React Naitve Error - Invariant Violation: ART has been removed from React Native

ART was imported from 'react-native' in the react-native-progress module.
import { Animated, ART, StyleSheet, View } from 'react-native';
I updated the module and now it imported from #react-native-community/art.
import { Surface as ARTSurface } from '#react-native-community/art';
ART is not used in the project anywhere else, yet I am still facing the same error.
Any idea what's wrong?
Error Message:
Invariant Violation: ART has been removed from React Native. It can now be installed and imported from '#react-native-community/art' instead of 'react-native'. See https://github.com/react-native-community/art.
Screenshot of the error.
By looking at your stack trace, You are using react-native-progress and this is an internal dependency of it and that's why you are facing this issue.
According to docs of react-native-progress.
https://github.com/oblador/react-native-progress/blob/master/README.md#reactart-based-components
So according to docs, you can remove it too for fixing this error.
Note: If you don't want the ReactART-based components and their dependencies, do a deep require instead: import ProgressBar from 'react-native-progress/Bar';.
So either you can avoid using these components which are ART based or try to fix them like below.
in file Circle.js, CircleSnail.js, Pie.js,
replace ART.Surface with
import {Surface} from '#react-native-community/art';
and in file Shapes/Arc.js
import {Shape, Path} from '#react-native-community/art';
and replace the same above.
Any package relies on ART will cause the issue with you , not only react-native-progress , but also packages with loaders like this react-native-loading-spinner-overlay ,
You can change this by finding another package of by fixing your imports
The Art library has been removed as of SDK 36 ,
If you need to use react-native-progress, which relies on ART, you can use the bare workflow and install #react-native-community/art, or implement your own progress indicator using Svg

Cannot Import Clipboard

Clipboard seems to be a pretty standard part of react-native's API. All of the tutorials on react-native's Clipboard tell me the same thing, just do this:
import { Clipboard } from 'react-native';
and I'm golden. Problem is, I'm getting complaints from my IDE that I:
Cannot import Clipboard because there is no Clipboard export in react-native
I'm very confused at this point and it doesn't seem that anyone else through a quick google search of my error msesage has ever had this problem before. I don't even know how to even begin debugging this. Or if even needs debugging as the code seems to work perfectly fine despite the complaints.
The Clipboard module was moved to react-native-community/react-native-clipboard.
You can install it with:
npm install --save #react-native-community/react-native-clipboard
and import it with:
import Clipboard from "#react-native-community/react-native-clipboard";
You can read more about it here

Getting "undefined is not an object (evaluating '_react2.proptypes.string')" after importing react-native-prompt

I am using the newest version of NPM, the version of exp is 57.0.0. When I add to my code in render method, I get an error "undefined is not an object (evaluating '_react2.proptypes.string')". Without adding everything works perfect.
Both Prop-Types and React-native-prompt are installed.
I have already tried to write import Prompt from 'prop-types'; instead of writing import Prompt from 'react-native-prompt'; but then I am getting the error that hasn't been found in Prop-Types.
Any suggestions on how to fix it?
Thank you
PropTypes moved into separate package. Use prop-types package.
react-native-prompt use outdated style of prop-types so you have to manually solve it.
go to /node-modules/react-native-prompt and edit main files in this way:
import { PropTypes } from 'react'
the above line is incorrect and must be like this:
import PropTypes from 'prop-types'
You have to import PropTypes in this way.
More info here.
Note:
React.PropTypes has moved into a different package since React v15.5. Please use the prop-types library instead. We provide a codemod script to automate the conversion.