Skip to main content

jsx-transform

ReactNative 适配 React 新的 jsx 转换，需要修改下项目配置，

1. 修改 tsconfig.json​

"jsx": "react-jsx", // 或者 "jsx": "react-native"

如果用 "jsx": "react" 则会有报错：

'React' refers to a UMD global, but the current file is a module. Consider adding an import instead.

2. 修改 babel.config.js，如果没有则在根目录创建该文件，内容：​

module.exports = function (api) {
    api.cache(true);
    return {
        presets: ['module:metro-react-native-babel-preset'],
        plugins: [
            'react-native-reanimated/plugin',
            [
                '@babel/plugin-transform-react-jsx',
                {
                    runtime: 'automatic',
                },
            ],
        ],
    };
};

安装：

npm i @babel/plugin-transform-react-jsx -D

3. 使用 reset-cache 编译执行：​

npm start -- reset-cache