使用Expo Router时如何自定义默认index.html文件？

升级到Expo Router后，默认的内置index.html模板会覆盖原有的web/index.html，要自定义需按以下步骤操作：

• 确保项目根目录存在web文件夹，若没有则新建。在该文件夹下创建index.html，可参考Expo默认模板修改（需保留<div id="root"></div>和应用挂载的script标签），示例：

<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>我的自定义Expo应用</title>
    <!-- 可添加自定义meta标签、样式链接等 -->
  </head>
  <body>
    <div id="root"></div>
    <script type="module" src="/src/main.tsx"></script>
  </body>
</html>

• 修改项目配置文件（app.json/app.config.js/app.config.ts），在expo字段下添加web配置，指定自定义index的路径：
  • 若用app.json：

{
  "expo": {
    // 其他原有配置
    "web": {
      "indexPath": "./web/index.html"
    }
  }
}

• 若用app.config.js：

export default {
  expo: {
    // 其他原有配置
    "web": {
      "indexPath": "./web/index.html"
    }
  }
}

• 重启Expo开发服务器，若存在缓存问题，可使用expo start -c清除缓存后启动，自定义的index.html即可生效。

内容的提问来源于stack exchange，提问作者Ken Mueller