我的编程空间,编程开发者的网络收藏夹
学习永远不晚

vue项目实现通过ip地址访问和localhost访问方式

短信预约 -IT技能 免费直播动态提醒
省份

北京

  • 北京
  • 上海
  • 天津
  • 重庆
  • 河北
  • 山东
  • 辽宁
  • 黑龙江
  • 吉林
  • 甘肃
  • 青海
  • 河南
  • 江苏
  • 湖北
  • 湖南
  • 江西
  • 浙江
  • 广东
  • 云南
  • 福建
  • 海南
  • 山西
  • 四川
  • 陕西
  • 贵州
  • 安徽
  • 广西
  • 内蒙
  • 西藏
  • 新疆
  • 宁夏
  • 兵团
手机号立即预约

请填写图片验证码后获取短信验证码

看不清楚,换张图片

免费获取短信验证码

vue项目实现通过ip地址访问和localhost访问方式

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
    }
};

以上为个人经验,希望能给大家一个参考,也希望大家多多支持编程网。

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

vue项目实现通过ip地址访问和localhost访问方式

下载Word文档到电脑,方便收藏和打印~

下载Word文档

猜你喜欢

vue项目如何实现ip和localhost同时访问

这篇文章主要介绍了vue项目如何实现ip和localhost同时访问,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
2022-11-13

springboot如何实现启动直接访问项目地址

这篇文章主要为大家展示了“springboot如何实现启动直接访问项目地址”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“springboot如何实现启动直接访问项目地址”这篇文章吧。spring
2023-06-22

云服务器部署项目用ip如何访问端口地址和端口ip地址

一、访问端口地址我们可以使用Python的ping命令来测试云服务器的端口地址和端口ip地址是否有效。使用ping命令的基本步骤如下:安装python和pip```pythonimportsubprocessimporttimeclassServer:definit(self,ip):self.ip=ipself.po
云服务器部署项目用ip如何访问端口地址和端口ip地址
2023-10-28

云服务器部署项目用ip如何访问端口地址信息和地址

打开控制面板并选择“管理工具”。在“管理工具”窗口中,右键单击“服务和应用程序”。选择“服务”。找到“DNSClient”服务,右键单击并选择“属性”。在属性窗口中,找到“DNSClientURL”选项,然后单击“添加”。在弹出的“DNSClientAddr”窗口中,输入服务器IP地址&ldq
2023-10-27

云服务器部署项目用ip如何访问网络地址和端口

根据云服务器的规模和服务需求选择合适的ip地址一般情况下,云服务器的ip地址可以选择一些常见的端口号来配置。例如,如果你的云服务器只支持HTTP和FTP协议,那么可以选择192.168.1.1或192.168.2.1等端口号。如果你的云服务器支持P2P协议,那么可以选择300.50.1.1或300.50.2.1等端口号
2023-10-27

云服务器部署项目用ip如何访问端口地址和端口

端口和端口号是用于访问云服务器的各种服务的。通过使用端口号,您可以访问某些服务,而通过使用端口号,您可以访问其它服务。例如,您可以使用Python编程语言创建一个名为“services”的服务,该服务接受一个端口号为8000的端口。通过使用该端口,您可以向该服务发送请求,而该服务会将请求转发到该端口。要使用端口号,您需
2023-10-27

云服务器部署项目用IP如何访问端口地址和端口信息

1.确定云服务器的公网IP地址在部署项目之前,首先需要确定云服务器的公网IP地址。这个IP地址是云服务器在公网上的唯一标识,其他用户可以通过该IP地址来访问你的服务器。2.配置安全组规则安全组是云服务器的一种网络访问控制机制,用于控制进出云服务器的网络流量。在部署项目之前,你需要配置安全组规则,允许外部用户通过特定的端口访问你的云服务器。例如,如果你的项目使用的是HTTP协议,默认的HTTP端口是80,...
2023-10-27

通过MySQL开发实现高并发访问控制的项目经验分享

通过MySQL开发实现高并发访问控制的项目经验分享随着互联网的快速发展,许多网站和应用程序面临着高并发访问的挑战。在这种情况下,让系统保持高可用性和良好的性能变得尤为重要。在最近的一项项目中,我经历了一个高并发访问控制的实现过程,并通过My
通过MySQL开发实现高并发访问控制的项目经验分享
2023-11-02

如何通过本地搭建wamp服务器并实现无公网IP远程访问

文章目录 前言1.Wamp服务器搭建1.1 Wamp下载和安装1.2 Wamp网页测试 2. Cpolar内网穿透的安装和注册2.1 本地网页发布2.2 Cpolar云端设置2.3 Cpolar本地设置 3. 公网访问测试4
2023-08-18

怎么在linux下通过iptables只允许指定ip地址访问指定端口的设置方法

这篇文章主要讲解了“怎么在linux下通过iptables只允许指定ip地址访问指定端口的设置方法”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“怎么在linux下通过iptables只允许指
2023-06-13

ASP.NET Core设置URLs的方法汇总(完美解决.NET 6项目局域网IP地址远程无法访问的问题)

本文汇总了ASP.NETCore中设置URL的方法,包括绝对URL、相对URL、路由、TagHelpers、UrlHelper和URL生成器。此外,还介绍了如何在.NET6中解决局域网IP地址远程无法访问的问题,方法包括禁用IIS集成、绑定到IPv4地址或使用UseUrls方法。通过了解这些方法,开发者可以根据应用程序的需要定制URL,确保应用程序在不同网络环境中都可访问。
ASP.NET Core设置URLs的方法汇总(完美解决.NET 6项目局域网IP地址远程无法访问的问题)
2024-04-02

在本地搭建WAMP服务器并通过端口实现局域网访问(无需公网IP)

文章目录 前言1.Wamp服务器搭建1.1 Wamp下载和安装1.2 Wamp网页测试 2. Cpolar内网穿透的安装和注册2.1 本地网页发布2.2 Cpolar云端设置2.3 Cpolar本地设置 3. 公网访问测试4
2023-08-19

Java实现文件上传到服务器本地并通过url访问的方法步骤

最近项目中使用到了文件上传到服务器的功能,下面这篇文章主要给大家介绍了关于Java实现文件上传到服务器本地并通过url访问的方法步骤,文中通过图文以及实例代码介绍的非常详细,需要的朋友可以参考下
2023-05-16

编程热搜

目录