是否可以 HMR 远程服务器上的资源？答案

【问题标题】：Is it possible to HMR a resource on a remote server?是否可以 HMR 远程服务器上的资源？
【发布时间】：2018-02-16 23:21:42
【问题描述】：

我正在 salesforce 上开发一个 typescript react 应用程序，并且有一些独特的工作流用例。为了减轻每次我对应用程序进行更改时的部署负担，我在我的 salesforce 页面（由webpack-dev-server 提供）中有一个开关来从 localhost 加载 js 包。

视觉力量

<apex:outputPanel layout="none" rendered="{!$CurrentPage.parameters.local == '1'}">
    <script src="https://localhost:8080/bundle.js" />
</apex:outputPanel>

这很好用，但如果我也能利用 HMR，那就太棒了。这可能吗？

我已经让 HMR 处理本地资源，但它似乎不适用于 Salesforce。

【问题讨论】：

标签： webpack salesforce webpack-hmr react-hot-loader

【解决方案1】：

当您 HMR 时，它会请求 2 个文件：

something.hot-reload.json
还有something.hot-reload.js

如果它不能 GET 两个文件，它就会失败。在请求这些文件时，检查您的网络选项卡中是否有 404。

这里的另一个问题是，如果它需要从远程服务器获取文件，那么该服务器将不在同一个域中，因此 CORS 将启动。如果您不将 CORS 标头放在响应服务器上那么请求将失败。

另外，由于 CORS 仅由浏览器强制执行，因此如果需要，您可以在 webpack-dev-server 上进行一些代理来代理对这些文件的请求。见https://webpack.js.org/configuration/dev-server/#devserver-proxy。

【讨论】：

所以我认为我能够解决 CORS 问题，但我认为 something.hot-reload.json 和 `something.hot-reload.js` 是问题所在。该 URL 中的 something 指向远程服务器，但我认为它需要指向 localhost？有没有办法配置这个？
查找 .json 和 .js 文件的服务位置 - 例如在您的浏览器中转到 localhost/i/think/they/are/here/hot-reload.json - 您应该会看到一个 JSON 文件 - 好的，现在您知道它们在哪里...下一步...
是为了让请求到达正确的位置 - 我认为答案是设置公共路径 - webpack.js.org/configuration/dev-server/#devserver-publicpath - 或者您可以在请求当前要代理的任何地方设置代理对本地主机的 hot-reload.json 请求（这可能并不容易，我认为在我的场景中，两台服务器都在本地主机上的不同端口上运行，所以这是可能的）
是的，我的不是在本地主机上运行，而是在远程 PAAS 上运行，所以我不确定它是如何工作的......
我假设你在 localhost 上运行 webpack，api 调用转到 PAAS，文件请求到 webpack？如果是这样，则将所有请求发送到 localhost 并让 webpack 代理对 PAAS 的 API 调用。- 使用代理设置 - 通过将 /api 放在这些请求的路径中来确定哪些调用转到 PAAS。对不起，昨晚很晚才给我答复，但我睡着了