Develop Reference

Import no longer working after upgrading [chart.js]

I just upgraded from 3.9.1 to 4.0.1 and the import I had previously working no longer works:
import Chart from 'chart.js/dist/chart.min.js';
It looks like the chart.min.js file no longer exists in the node_module. I couldn't find any information about this breaking change on GitHub or in the docs.
Any more information would be helpful, thanks!
I tried changing the import to use a different file but the same error message persists:
Missing "./dist/chart.umd.js" export in "chart.js" package

The reason I was using this method is because I am using the web framework svelte-kit and in the previous version of chart.js import Chart from 'chart.js/auto'; was not working for me due to the build step. I tried it again after upgrading to v4 and it appears to be working now. Thanks!

TypeError: null is not an object (evaluating 'bridge.isSensorAvailable')

react-native-biometrics npm package for biometric authentication.
Exporting as module would not work both with IOS & Android emulators and Updated Android OS smartphone. Tried the package versions 2.1.4 and 3.0.1. Dependencies checked.
Based on this code snippet from the README. (other biometric npm packages worked in similar way, excluding wrong export implementation or biometric specific issues).
import ReactNativeBiometrics from 'react-native-biometrics'
ReactNativeBiometrics.isSensorAvailable()
.then((resultObject) => {
const { available, biometryType } = resultObject
if (available && biometryType === ReactNativeBiometrics.TouchID) {
console.log('TouchID is supported')
} else if (available && biometryType === ReactNativeBiometrics.FaceID) {
console.log('FaceID is supported')
} else if (available && biometryType === ReactNativeBiometrics.Biometrics) {
console.log('Biometrics is supported')
} else {
console.log('Biometrics not supported')
}
})
If it is a common issue and there is an alternative expo solution for generating cryptographic keys other than local auth, this might help me and others as well.

NativeModules (usually ones that access hardware) packages can't be used with expo managed projects, but only with bare workflow.
managed-vs-bare.
Looking for a result based biometric solution of either kind:
Make this lib work.
Alternative for react native.
I found an alternative that is even more broadly in use and for some reason initially missed it.
npm package - react-native-keychain Should be for non expo managed projects. But didn't work as well.
Alternatives for expo managed solution - use expo-secure-store and expo-local-authentication

NativeScript Version 8.2.1 : how to use old outdated plugins

I am new to NativeScript and Webpack and i have migrated my native script app from 6.5.1 to 8.2 version, and i am using nativescript-orientation-free plugin ,i am getting build errors as this plugin still refers to tns-core-modules which is no longer supported in Native Script 8 and i am getting below errors
ERROR in ./node_modules/nativescript-orientation-free/orientation.js 17:12-48
Module not found: Error: Can't resolve 'tns-core-modules/ui/enums' in '/Users/admin/Development/project/node_modules/nativescript-orientation-free'
ERROR in ./node_modules/nativescript-orientation-free/orientation.js 18:12-48
Module not found: Error: Can't resolve 'tns-core-modules/ui/frame' in '/Users/admin/Development/project/node_modules/nativescript-orientation-free'
we do not want to use this paid version pro-plugins-nativescript-orientation
can you please let me know how can i fix this issue? is there anything i can do in the webpack.config.js ? I am stuck here.

You have my sympathies. (A quote from the movie Alien.)
Migrating a NativeScript app from 6.5 to 8.x can be wildly frustrating due to all the breaking changes. Make sure you watch this video: Migrating Legacy NativeScript 6 Project to 8.
When Migrating my app I found I had to migrate several of the plugins I used. Patch-package is your friend! To answer your question, you'll need to revise the links you circled. Sometimes this is easy, sometimes this requires investigation.
These three should work:
import { Application as application } from '#nativescript/core';
const Enums = require("#nativescript/core/core-types").Enums;
import { Frame as frame } from '#nativescript/core';
I expect these two should work, 'tho I didn't use them in my project:
import { Page } from '#nativescript/core';
import { View as view } from '#nativescript/core';
Good luck!

i removed this plugin and able to set the orientation without any third party plugins using
UIDevice.currentDevice.setValueForKey(1, "orientation");

'ActionSheetIOS' is not exported from 'react-native-web/dist/index'

How to avoid the this kind of warning?
My app is working but it gives warning in terminal like below
Compiled with warnings.
/home/karim/Desktop/React-Native/RN-Complete-Guide/node_modules/react-navigation-header-
buttons/src/overflowMenuPressHandlers.js
Attempted import error: 'ActionSheetIOS' is not exported from 'react-native-web/dist/index'.
It is because of of I imported HeaderButtons and HeaderButton from react-navigation-header-buttons like below
import { HeaderButtons } from "react-navigation-header-buttons";
import { HeaderButton } from "react-navigation-header-buttons";
And I am using react-native 4.x veriosn. is there any way to avoid this warning?

This file in the source for react-navigation-header-buttons imports ActionSheetIOS, which is not supported by React Native web applications. This seems like it's probably an issue with React Native web itself, as even importing the ActionSheetIOS component in your project without actually using it will cause a crash from my past experience.
You probably won't be able to use react-navigation-header-buttons for your solution because of this issue. The authors also go on to say in their README that web support is currently experimental:
Supports iOS and Android, web support is experimental.
I'd suggesting either finding a way to avoid this library or flag an issue on the repo to suggest swapping ActionSheetIOS in with a cross-platform action sheet solution like react-native-action-sheet.

in react-native-web/dist/index.js i exported
export { ActionSheetIOS }; and somehow the warning disappeared

React Native how to add index.android.js manually?

I am new to React Native, I'm following a video tutorial for beginners. I'm developing on windows 10 and using React Native version 0.49.1 . In the tutorial I'm following there are two index files: index.android.js & index.ios.js.
As I understand those file are untied now to index.js file,
I got it from this question that was asked.
Nevertheless, I still want to work with two separate index files, but I don't know how to do so - do I have to delete App.js file and index.js files?
And if so, what should be the content of index.android.js & ios files?
I would appreciate an explanation or a quick guide on how to do it.
Thanks in advance :)

For projects created with react-native init, an index.js file is still generated, and looks something like this initially:
import { AppRegistry } from 'react-native';
import App from './App';
AppRegistry.registerComponent('YourProjectName', () => App);
Manually adding App.ios.js and App.android.js in the same directory will allow you to include unique code for each platform, as it follows the pattern for platform-specific extensions. However, it won't be enough to have either one or the other. You need to include both otherwise the code splitting won't take effect (and will default to whatever is present in App.js).
So to answer your question, yes you need to delete App.js and replace it with android.App.js and ios.App.js. Then restart the React Native packager terminal window for your simulator or device to detect the change.