VUE运行项目后,只有local地址,没有network地址(添加nerwork地址)

使用前

使用后

解决方案

1.找到build文件夹下的webpack.dev.conf.js文件,更改messages中的内容

javascript 复制代码
devWebpackConfig.plugins.push(new FriendlyErrorsPlugin({
        compilationSuccessInfo: {
          messages: [
            `App running: `,
            `Local:  http://${devWebpackConfig.devServer.host}:${port}`,
            `Network: http://${require('ip').address()}:${port}`,
          ]
        },
      }))

这里就可以出现了,如果出现以下无法访问网站问题,不能使用,请继续添加下面步骤

2.找到设置代理的地方,添加public,写入自己电脑的Ipv4地址

javascript 复制代码
 public:'192.168.x.xx'//ip地址


3.在package.json中的script的dev,添加--host 0.0.0.0

javascript 复制代码
"scripts": {
    "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js --host 0.0.0.0 ",
  },

重新运行就可以了

相关推荐
纯粹的热爱几秒前
Ubuntu 安装 Node.js 22.x(通过 NodeSource 官方源)
前端
Highcharts3 分钟前
如何选择正确的图表:驱动理解和洞察力的三部分框架(第3部分)
前端·数据可视化
JavaGuide22 分钟前
Github 史诗级故障,与此同时,Cursor 版「GitHub」正式上线!
前端·后端
郭邯23 分钟前
用 AI 写了一个经纬度格式转换工具,从需求到落地的完整过程
前端
不一样的少年_25 分钟前
修了 Bug、做了重构,为什么老板还是觉得你没产出?
前端·后端·程序员
马可家的菠萝29 分钟前
Vue3 + Canvas 手绘笔记工程化实践:别把画布只当成一张 PNG
前端·vue.js·算法
IMPYLH36 分钟前
HTML 的 <h1>–<h6> 元素
前端·javascript·html
IMPYLH39 分钟前
HTML 的 <head> 元素
前端·html
用户8417948145644 分钟前
如何用 vue 甘特图来实现计划和实际双任务条进度展示
vue.js
卸任1 小时前
AI英语学习助手:从翻译工具到 AI 英语学习助手
前端·electron