vue 本地服务不能被外部IP访问的完美解决方法

(编辑:jimmy 日期: 2025/1/18 浏览:2)

解决 webpack-dev-serveri 启动后通过外部访问报错 invalid host header

修改 config/index.js 的 host 属性为 ‘0.0.0.0'

{
// ...,
host: '0.0.0.0',
port: 8080,
// ...
}

修改 build/webpack.dev.conf.js 的 devServer 配置

增加 disableHostCheck = true

devServer: {
  clientLogLevel: 'warning',
  historyApiFallback: true,
  hot: true,
  compress: true,
  host: HOST || config.dev.host,
  port: PORT || config.dev.port,
  open: config.dev.autoOpenBrowser,
  overlay: config.dev.errorOverlay
   "external nofollow" href="http://192.168.1.100:8080">http://192.168.1.100:8080

PS:vue把localhost改成ip地址无法访问—解决方法

打开package.json文件,找到下面的代码

"scripts": {
  "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
  "start": "npm run dev",
  "build": "node build/build.js"
 },

改成

"scripts": {
  "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js --host 192.168.0.114",
  "start": "npm run dev",
  "build": "node build/build.js"
 },

host后面是你的ip地址。

以上所述是小编给大家介绍的vue 本地服务不能被外部IP访问的解决方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!

一句话新闻

微软与英特尔等合作伙伴联合定义“AI PC”:键盘需配有Copilot物理按键
几个月来,英特尔、微软、AMD和其它厂商都在共同推动“AI PC”的想法,朝着更多的AI功能迈进。在近日,英特尔在台北举行的开发者活动中,也宣布了关于AI PC加速计划、新的PC开发者计划和独立硬件供应商计划。
在此次发布会上,英特尔还发布了全新的全新的酷睿Ultra Meteor Lake NUC开发套件,以及联合微软等合作伙伴联合定义“AI PC”的定义标准。