Open jbizcloud opened 2 years ago
pragma and pragmaFrag cannot be set when runtime is automatic.
This makes me wonder if this is because of our useSlots pragma..
Is there any solution available?
We're tracking this work but it's not high on the priority list. Based on some other pages, you may be able to work around this by switching to classic runtime: https://babeljs.io/docs/en/babel-preset-react/#with-a-configuration-file-recommended
Note in latest versions of RN, the metro-babel-react-native preset was modified to always pass runtime:automatic. (https://github.com/facebook/metro/pull/848)
So generally to get past this error you should use the useTransformReactJSXExperimental flag:
Ex:
module.exports = {
presets: [['@rnx-kit/babel-preset-metro-react-native', {useTransformReactJSXExperimental:true}]],
plugins: [['@babel/plugin-transform-react-jsx', { runtime: 'classic' }]]
};
I ran into the same issue in a blank RN app created with Expo, which by default also uses "automatic" runtime.
Here is how to change it to "classic" to temporarily mitigate the issue if the app is created through Expo: https://www.npmjs.com/package/babel-preset-expo
presets: [['babel-preset-expo', { jsxRuntime: 'classic', }]]
Willing to submit a PR to fix?
Requested priority
Normal
Products/applications affected
FluentUI not able to render in Expo project.
Package version(s)
"@fluentui/react-native": "^0.31.5",
OS version(s)
Windows 11, MacOS Monterey
Platform
Xcode version
14
Please provide a reproduction of the bug
Instal Expo
https://docs.expo.dev/get-started/installation/
Create new React Native app
npx create-expo-app my-app
Install Fluent UI
npm i @fluentui/react-native
Add Checkbox to App.js
export default function App() { return (
); }
Started Metro Bundler iOS Bundling failed 3058ms node_modules\@fluentui-react-native\button\lib-commonjs\deprecated\Button.js: D:\rep\ExpoLab\JSlab\ExpoLab\node_modules\@fluentui-react-native\button\lib-commonjs\deprecated\Button.js: pragma and pragmaFrag cannot be set when runtime is automatic.
Actual behavior
App error message
Expected behavior
App should display the added Checkbox