I am trying to get the current locale from ios devices.
I followed this guide when I created my project and I'm using expo.
I tried the following code
if (Platform.OS === "android") {
langRegionLocale = NativeModules.I18nManager.localeIdentifier || "";
} else if (Platform.OS === "ios") {
langRegionLocale = NativeModules.SettingsManager.settings.AppleLocale || "";
}
and it worked for android, but when tested on an iPhone, it did not work and said SettingsManager was undefined when i logged it.
How can I get the current locale for ios without ejecting or using AlexanderZaytsev/react-native-i18n?
If possible I would like to use something that is built in.
Below is my package.json
{
"name": "demoapp",
"version": "0.1.0",
"private": true,
"devDependencies": {
"react-native-scripts": "1.5.0",
"jest-expo": "^21.0.2",
"react-test-renderer": "16.0.0-alpha.12"
},
"main": "./node_modules/react-native-scripts/build/bin/crna-entry.js",
"scripts": {
"start": "react-native-scripts start",
"eject": "react-native-scripts eject",
"android": "react-native-scripts android",
"ios": "react-native-scripts ios",
"test": "node node_modules/jest/bin/jest.js --watch"
},
"jest": {
"preset": "jest-expo"
},
"dependencies": {
"expo": "^21.0.0",
"react": "16.0.0-alpha.12",
"react-native": "^0.48.4",
"react-navigation": "^1.0.0-beta.13",
"react-redux": "^5.0.6",
"redux": "^3.7.2",
"redux-thunk": "^2.2.0"
}
}
Expo Util API has a method for getting device locale.
Expo.Util.getCurrentLocaleAsync()
Returns the current device
locale as a string.
Related
The default files generated from npx react-native init {file_name} resulted in a 558.7MB app. This app is running on a physical device. Its also using typescript, but I don't think that should have that much of an effect. I have created react native apps in the past before but they were never this big, has something changed? Is this size normal now?
package.json
{
"name": "-------",
"version": "0.0.1",
"private": true,
"scripts": {
"android": "react-native run-android",
"ios": "react-native run-ios",
"start": "react-native start",
"test": "jest",
"lint": "eslint . --ext .js,.jsx,.ts,.tsx"
},
"dependencies": {
"react": "18.1.0",
"react-native": "0.70.6"
},
"devDependencies": {
"#babel/core": "^7.12.9",
"#babel/runtime": "^7.12.5",
"#react-native-community/eslint-config": "^2.0.0",
"#tsconfig/react-native": "^2.0.2",
"#types/jest": "^26.0.23",
"#types/react": "^18.0.21",
"#types/react-native": "^0.70.6",
"#types/react-test-renderer": "^18.0.0",
"#typescript-eslint/eslint-plugin": "^5.37.0",
"#typescript-eslint/parser": "^5.37.0",
"babel-jest": "^26.6.3",
"eslint": "^7.32.0",
"jest": "^26.6.3",
"metro-react-native-babel-preset": "0.72.3",
"react-test-renderer": "18.1.0",
"typescript": "^4.8.3"
},
"jest": {
"preset": "react-native",
"moduleFileExtensions": [
"ts",
"tsx",
"js",
"jsx",
"json",
"node"
]
}
}
I have a react-native app that uses expo.
The location permissions work on android, but not on iOS.
On a real iPhone (iOS version 14.4.2), it does nothing. On a simulator, I get this error message:
[Unhandled promise rejection: Error: LOCATION_FOREGROUND permission is required to do this operation.]
at node_modules/react-native/Libraries/BatchedBridge/NativeModules.js:103:50 in promiseMethodWrapper
at node_modules/#unimodules/react-native-adapter/build/NativeModulesProxy.native.js:15:23 in moduleName.methodInfo.name
at http://127.0.0.1:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false&minify=false:293333:90 in watchPositionAsync$
at http://127.0.0.1:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false&minify=false:293327:37 in watchPositionAsync
Update: I tried it on another Android device and it did not work, so maybe it works on my main Android phone because the permissions were already granted when running a previous version? There is a bug report about permissions breaking between Expo version 40 and 41 https://github.com/expo/expo/issues/12581
Here is what I'm using:
app.json:
{
"expo": {
"name": "Andiamo",
"slug": "andiamo_places",
"version": "1.0.0",
"orientation": "default",
"icon": "./assets/icon.png",
"splash": {
"image": "./assets/splash.png",
"resizeMode": "contain",
"backgroundColor": "#ffffff"
},
"updates": {
"fallbackToCacheTimeout": 0
},
"assetBundlePatterns": [
"**/*"
],
"ios": {
"bundleIdentifier": "com.andiamoplaces.andiamotravelapp",
"supportsTablet": true,
"infoPlist": {
"NSLocationUsageDescription":
"The app needs permission to access your location, if you want to be located on the map.",
"NSLocationWhenInUseUsageDescription": "The app needs permission to access your location, if you want to be located on the map",
"NSLocationAlwaysUsageDescription": "The app needs permission to access your location, if you want to be located on the map",
"NSLocationAlwaysAndWhenInUseUsageDescription": "The app needs permission to access your location, if you want to be located on the map",
"NSPhotoLibraryUsageDescription": "The app needs permission to your camera roll, if you want to upload pictures.",
"NSCameraUsageDescription": "The app needs permission to your camera, if you want to take pictures from the app."
}
},
"android": {
"package": "com.andiamoplaces.andiamotravelapp",
"adaptiveIcon": {
"foregroundImage": "./assets/adaptive-icon.png",
"backgroundColor": "#FFFFFF"
},
"permissions": [
"CAMERA",
"LOCATION"
]
},
"web": {
"favicon": "./assets/favicon.png"
},
"description": ""
}
}
package.json:
{
"main": "node_modules/expo/AppEntry.js",
"scripts": {
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"web": "expo start --web",
"eject": "expo eject",
"postinstall": "jetifier -r"
},
"dependencies": {
"#expo/vector-icons": "^12.0.0",
"#react-native-community/clipboard": "^1.5.1",
"#react-native-community/datetimepicker": "3.2.0",
"#react-native-community/masked-view": "0.1.10",
"#react-navigation/native": "^3.8.4",
"#use-expo/font": "^2.0.0",
"cross-fetch": "^3.1.4",
"expo": "^41.0.0",
"expo-camera": "~11.0.2",
"expo-cli": "^4.4.4",
"expo-clipboard": "~1.0.2",
"expo-facebook": "~11.0.5",
"expo-font": "~9.1.0",
"expo-image-manipulator": "~9.1.0",
"expo-image-picker": "~10.1.4",
"expo-location": "~12.0.4",
"expo-media-library": "~12.0.2",
"expo-permissions": "~12.0.1",
"expo-status-bar": "~1.0.4",
"firebase": "8.2.3",
"geolib": "^3.3.1",
"global": "^4.4.0",
"luxon": "^1.26.0",
"native-base": "^2.15.2",
"react": "16.13.1",
"react-devtools": "^4.13.2",
"react-dom": "16.13.1",
"react-native": "https://github.com/expo/react-native/archive/sdk-41.0.0.tar.gz",
"react-native-color-picker": "^0.6.0",
"react-native-draggable-flatlist": "^2.6.1",
"react-native-gesture-handler": "~1.10.2",
"react-native-ionicons": "^4.6.5",
"react-native-maps": "0.27.1",
"react-native-material-menu": "^1.2.0",
"react-native-modal": "^11.10.0",
"react-native-pell-rich-editor": "^1.7.0",
"react-native-popup-menu": "^0.15.10",
"react-native-prompt-crossplatform": "^1.6.1",
"react-native-ratings": "^8.0.4",
"react-native-reanimated": "~2.1.0",
"react-native-safe-area-context": "3.2.0",
"react-native-safe-area-view": "^1.1.1",
"react-native-screens": "~3.0.0",
"react-native-simple-radio-button": "^2.7.4",
"react-native-switch": "^2.0.0",
"react-native-switch-selector": "^2.1.4",
"react-native-vector-icons": "^8.1.0",
"react-native-web": "~0.13.12",
"react-native-webview": "11.2.3",
"react-native-youtube-iframe": "^2.0.1",
"react-navigation": "^4.4.4",
"react-navigation-drawer": "^2.7.1",
"react-navigation-stack": "^2.10.4",
"react-navigation-tabs": "^2.11.1",
"react-redux": "^7.2.4",
"redux": "^4.1.0",
"redux-persist": "^6.0.0",
"redux-thunk": "^2.3.0"
},
"devDependencies": {
"#babel/core": "~7.9.0",
"jetifier": "^1.6.8"
},
"private": true
}
code:
startUserLocationUpdates = async () => {
const returns = await Location.watchPositionAsync(
{
accuracy: Location.Accuracy.BestForNavigation,
timeInterval: 1000,
// distanceInterval: 0,
},
(loc) => {
if (this.props.ShowLocation) this.centerMapTo(loc.coords.latitude, loc.coords.longitude);
this.props.onSetCurrentLocation({ latitude: loc.coords.latitude, longitude: loc.coords.longitude });
}
);
this._removeLocationUpdates = returns.remove;
};
An updated version of the Permissions with formatted code.
if (Platform.OS !== "web") {
const { status } = await Location.requestForegroundPermissionsAsync();
if (status !== "granted") {
Alert.alert(
"Insufficient permissions!",
"Sorry, we need location permissions to make this work!",
[{ text: "Okay" }]
);
return;
}
}
In fact, I've had the opposite scenario; iOS was working fine, but Android did not without the code above.
<uses-permission android:name=... in the AndroidManifest.xml is being automatically by Expo, so you don't need to care about it and modify anything.
I keep getting this error:
error in ./node_modules/keytar/build/Release/keytar.node
Module parse failed: Unexpected character '�' (1:2)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
(Source code omitted for this binary file)
# ./node_modules/keytar/lib/keytar.js 1:13-52
# ./src/background.js
# multi ./src/background.js
I have background.js set as the main electron file in package.json because I'm using vue/vuetify with it which uses a main.js file as well.
{
"name": "project",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint",
"electron:build": "vue-cli-service electron:build",
"electron:serve": "vue-cli-service electron:serve",
"postinstall": "electron-builder install-app-deps",
"postuninstall": "electron-builder install-app-deps"
},
"main": "background.js", // <------------------ see right here
"dependencies": {
"axios": "^0.19.0",
"core-js": "^3.4.3",
"jwt-decode": "^2.2.0",
"keytar": "^5.0.0",
"request": "^2.88.0",
"vue": "^2.6.10",
"vue-router": "^3.1.3",
"vuetify": "^2.1.0",
"vuex": "^3.1.2"
},
"devDependencies": {
"#vue/cli-plugin-babel": "^4.1.0",
"#vue/cli-plugin-eslint": "^4.1.0",
"#vue/cli-service": "^4.1.0",
"babel-eslint": "^10.0.3",
"electron": "^7.1.3",
"eslint": "^5.16.0",
"eslint-plugin-vue": "^5.0.0",
"node-loader": "^0.6.0",
"sass": "^1.19.0",
"sass-loader": "^8.0.0",
"vue-cli-plugin-electron-builder": "^1.4.3",
"vue-cli-plugin-vuetify": "^2.0.2",
"vue-template-compiler": "^2.6.10",
"vuetify-loader": "^1.3.0"
},
"eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": [
"plugin:vue/essential",
"eslint:recommended"
],
"rules": {},
"parserOptions": {
"parser": "babel-eslint"
}
},
"browserslist": [
"> 1%",
"last 2 versions"
]
}
Searching, it seems this happens when keytar is used in a renderer process. But background.js isn't a renderer process. Or am I missing something? I am completely new to electron.
I needed to mark keytar as external (as mentioned at https://nklayman.github.io/vue-cli-plugin-electron-builder/guide/guide.html#native-modules)
// vue.config.js
module.exports = {
pluginOptions: {
electronBuilder: {
// List native deps here if they don't work
externals: ['keytar']
}
}
}
Once I did that it worked properly.
Run appropriate loader (source).
yarn add node-loader -D
// vue.config.js
configureWebpack: {
devtool: 'source-map',
module: {
rules: [
{ test: /\.node$/, loader: 'node-loader' }
]
}
}
React-native iOS blank screen on first launch iPad running iOS 12.0.1.
After closing the app and re-launching it, it displays normally.
This only happens on physical device, I couldn't reproduce it on Xcode simulators (it runs correctly).
This is the app in action: https://photos.app.goo.gl/ecwwuYGkh5QRHzU17
Libraries in use
{
"name": "flightech",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest",
"build:ios": "react-native bundle --entry-file='index.js' --bundle-output='./ios/flightech/main.jsbundle' --dev=false --platform='ios' --assets-dest='./ios'"
},
"dependencies": {
"moment": "^2.22.2",
"native-base": "^2.7.1",
"react": "16.4.1",
"react-native": "0.56.0",
"react-native-background-fetch": "^2.4.3",
"react-native-image-picker": "^0.26.10",
"react-native-modal-datetime-picker": "^6.0.0",
"react-native-onesignal": "^3.2.6",
"react-native-push-notification": "^3.0.2",
"react-native-router-flux": "^4.0.0-beta.31",
"react-native-tab-view": "^1.0.2",
"react-native-vector-icons": "^4.6.0",
"socket.io-client": "^2.1.1"
},
"devDependencies": {
"babel-jest": "23.4.0",
"babel-preset-react-native": "^5",
"jest": "23.4.1",
"react-test-renderer": "16.4.1"
},
"jest": {
"preset": "react-native"
}
}
I just created a new project on react-native version 0.37 on iOS.
I've setting up this part of info.plist
server is running :
But this loads loop on this url:
url: /index.ios.bundle?platform=ios&dev=true&minify=false
And I finally get this error :
my package.json
{
"name": "Mich",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest"
},
"dependencies": {
"react": "15.3.2",
"react-native": "0.37.0"
},
"jest": {
"preset": "jest-react-native"
},
"devDependencies": {
"babel-jest": "17.0.2",
"babel-preset-react-native": "1.9.0",
"jest": "17.0.3",
"jest-react-native": "17.0.3",
"react-test-renderer": "15.3.2",
"whatwg-fetch": "2.0.1"
}
}
I have never had this error before by starting a new project. Someone can explain me what is wrong?
I've found a solution, i press CMD+R and during server is loading, i press CMD + D and i press on Debug JS remotly.