React构建后如何添加指向本地HTML文件的外部链接？

首先要说明的是，你当前用的_reactScroll.Link是专门用于单页应用内部滚动导航的组件，它并不适合跳转到外部HTML文件（包括本地文件）。要实现打开本地HTML文件的需求，你应该改用原生的<a>标签来替代。

下面分两种常见场景给你具体的代码修改方案：

场景1：本地HTML文件和React构建产物在同一目录 #

比如你的React项目构建后，build文件夹里同时存在index.html和你的本地隐私政策文件privacy.html，代码可以改成这样：

_react2.default.createElement(
  'li',
  null,
  _react2.default.createElement(
    'a',
    { href: './privacy.html', target: '_blank', rel: 'noopener noreferrer' },
    _Localization2.default.strings.privacypolicy
  )
)

这里添加的target="_blank"会让链接在新窗口打开，rel="noopener noreferrer"是前端安全的最佳实践，能避免潜在的窗口劫持风险。

场景2：本地HTML文件在设备的其他路径下 #

如果你的HTML文件存在设备的独立目录（比如Windows的C:/Documents/privacy.html，或是macOS/Linux的~/Documents/privacy.html），需要用file://协议指定完整路径：

_react2.default.createElement(
  'li',
  null,
  _react2.default.createElement(
    'a',
    { href: 'file:///C:/Documents/privacy.html', target: '_blank', rel: 'noopener noreferrer' },
    _Localization2.default.strings.privacypolicy
  )
)

注意不同操作系统的路径格式差异：

• Windows路径格式：file:///C:/你的文件路径/file.html
• macOS/Linux路径格式：file:///home/你的用户名/你的文件路径/file.html

另外你提到构建后只有修改app.bundle.js才生效，这是因为React项目构建时会把所有组件代码打包到这个文件中，所以你修改源代码后需要重新执行构建命令，或者在开发环境下开启热重载功能来实时预览修改效果。

内容的提问来源于stack exchange，提问作者22anonymous