如果你正在开发前端应用，使用 webpack-dev-server 可以方便地进行本地开发和调试。然而，当你在 UC 浏览器中尝试运行 webpack-dev-server 时，可能会遇到问题，例如页面加载失败或者无法正常启动服务器。本文将帮助你解决这个问题。
问题分析
首先，我们需要了解一下 UC 浏览器的特点。UC 浏览器是一款基于 Chrome 内核的浏览器，但是它具有自己的一些特性和限制。其中一个比较重要的限制是，UC 浏览器禁止了 localhost 的访问。
当你使用 webpack-dev-server 启动一个本地服务器时，它将默认监听 localhost:8080 端口。而在 UC 浏览器中，由于禁止了 localhost 的访问，因此无法正常连接到本地服务器。
解决方案
使用 IP 地址代替 localhost
为了解决这个问题，我们可以使用 IP 地址来代替 localhost。IP 地址可以通过执行命令 ipconfig 或者 ifconfig 来获取。在 Windows 上，执行 ipconfig 命令后可以看到类似如下的输出：
Ethernet adapter Local Area Connection: Connection-specific DNS Suffix . : example.com Link-local IPv6 Address . . . . . : fe80::d8e4:85a5:ec65:1c4b%4 IPv4 Address. . . . . . . . . . . : 192.168.1.100 Subnet Mask . . . . . . . . . . . : 255.255.255.0 Default Gateway . . . . . . . . . : 192.168.1.1
在这个例子中，我们可以使用 192.168.1.100 来代替 localhost。
为了让 webpack-dev-server 使用 IP 地址来启动本地服务器，我们需要在启动命令中指定 --host 参数。例如：
webpack-dev-server --host 192.168.1.100
现在，在 UC 浏览器中访问 http://192.168.1.100:8080 就应该可以正常加载页面了。
修改 hosts 文件
另一个解决方案是修改 hosts 文件来绑定一个域名到本地 IP 地址。这样，在 UC 浏览器中访问域名就会自动重定向到本地 IP 地址。具体操作步骤如下：
打开 hosts 文件。在 Windows 上，hosts 文件位于
C:\Windows\System32\drivers\etc\hosts。在文件末尾添加一行类似如下的内容：
192.168.1.100 example.com
这里的
example.com可以替换成你喜欢的任何域名。保存文件。
现在，在 UC 浏览器中访问 http://example.com:8080 就应该可以正常加载页面了。
示例代码
下面是一个简单的示例 webpack 配置，它使用 IP 地址启动本地服务器：
-- -------------------- ---- -------
----- ---- - ----------------
----- ----------------- - -------------------------------
-------------- - -
----- --------------
------ -----------------
------- -
--------- ------------
----- ----------------------- --------
--
---------- -
----- ----------------
--
-------- -
--- -------------------
--------- -------------------
---
--
--总结
UC 浏览器禁止了 localhost 的访问，导致 webpack-dev-server 无法正常运行。为了解决这个问题，我们可以使用 IP 地
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5033