元素
元素
工具
博客
问答

React Native热更新不生效是怎么回事？

Tr° 潇郡 阅读 11
移动

我用的是React Native 0.72，开发时修改代码保存后模拟器没反应，得手动刷新才行。明明之前热重载是好用的，现在连Fast Refresh开关打开也没用。是不是哪里配置错了？

我试过重启Metro、重装App、清除缓存，都不行。下面是我App.js里的一段代码，改文字内容根本不会自动更新：

import React from 'react';
import { View, Text } from 'react-native';

const App = () => {
  return (
    <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
      <Text>测试热更新 - 改了这里但没反应</Text>
    </View>
  );
};

export default App;
我来解答 赞 6 收藏
二维码
手机扫码查看
反馈
1 条解答
Des.殿原
Des.殿原 Lv1
这事儿挺烦人的，可能是配置文件出了问题。检查下 metro.config.js 和 babel.config.js。有时候缓存也会搞鬼，确保清理干净。

试试这个 metro.config.js 配置，看能不能解决问题：

const { getDefaultConfig } = require('metro-config');



module.exports = (async () => {

  const {

    resolver: { sourceExts, assetExts }

  } = await getDefaultConfig();

  return {

    transformer: {

      babelTransformerPath: require.resolve('react-native-svg-transformer')

    },

    resolver: {

      assetExts: assetExts.filter(ext => ext !== 'svg'),

      sourceExts: [...sourceExts, 'svg']

    }

  };

})();


如果没用，再看看 babel.config.js 是否正常：

module.exports = {

  presets: ['module:metro-react-native-babel-preset'],

  plugins: [

    'react-native-reanimated/plugin',

  ],

};


如果这些都没效果，可能是项目结构或依赖问题，试着重新初始化一个项目，然后慢慢迁移代码过去。
点赞
2026-03-21 09:01
相关推荐
元素
元素
工具
博客
问答
登录/注册