如何让Vue项目同时支持通过IP地址和localhost访问？

本文共计314个文字，预计阅读时间需要2分钟。

目录 + Vue项目通过IP地址访问和localhost访问 + Vue项目中将localhost改为IP地址访问 + Vue2.0项目中localhost改为IP地址访问 + Vue3项目中改为IP地址访问 + Vue项目通过IP地址访问和localhost访问 + 为实现Vue项目

目录

• vue项目通过ip地址访问和localhost访问
• vue项目中把localhost改成ip地址访问
• vue2.0项目中 localhost改成ip地址访问
• vue3项目改成ip地址访问

vue项目通过ip地址访问和localhost访问

为了实现vue项目启动服务，多个人可以查看，别人可以通过ip+端口访问

在config文件下的index.js文件中，修改host为：

host: '0.0.0.0'，

或者在package.json文件下"scripts"的"dev"后面加上–host 0.0.0.0"

例如：

"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js --host 0.0.0.0",

重启服务可以看到通过localhost和IP地址都可以访问到这个服务。

vue项目中把localhost改成ip地址访问

vue2.0项目中 localhost改成ip地址访问

config/index.js改成

host: '0.0.0.0',  port: 8888,

打包后index.html空白 修改

webpack.prod.conf.js 里的

publicPath:'./',

vue3项目改成ip地址访问

1.在项目的根目录下创建文件vue.config.js

2.在该文件中进行相关配置，从而覆盖默认配置

module.exports = {     outputDir:"course-analysis", //打包后的项目目录名称     publicPath: './',     devServer:{         host: '0.0.0.0',         port:8888     } };

以上为个人经验，希望能给大家一个参考，也希望大家多多支持易盾网络。