Vite内网ip访问,两种配置方式

这篇具有很好参考价值的文章主要介绍了Vite内网ip访问,两种配置方式。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

问题

使用vite运行项目的时候,控制台会只出现127.0.0.1(localhost)本地地址访问项目。不可以通过公司内网ip访问,其他团队成员无法访问,这是因为没有将服务暴露在局域网中:
Vite内网ip访问,两种配置方式

两种解决方式

方式一:修改vite的配置文件(vite.config.ts)
添加 host: "0.0.0.0"

export default defineConfig({
  plugins: [vue(), vueJsx()],
  resolve: {
    alias: {
      "@": fileURLToPath(new URL("./src", import.meta.url))
    },
  },
  server: {
    port: 9999,
    host: "0.0.0.0"
  },
});

方式二:修改package.json文件

  "scripts": {
    "dev": "vite --host 0.0.0.0",
    "build": "vite build",
    "preview": "vite preview"
  },

结果

采用上面任一方式,就可以通过内网地址访问了:
Vite内网ip访问,两种配置方式文章来源地址https://www.toymoban.com/news/detail-515586.html

到了这里,关于Vite内网ip访问,两种配置方式的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • vite 使用本地 ip + localhost 访问服务

    在 vite.config.js 中,如果未配置 server.host,默认服务将以 localhost 进行启动,此时我们可以通过 localhost:port 或 127.0.0.1:port 进行应用访问。 启动服务后控制台输出: 如果配置了 server.host 的值为 0.0.0.0,静态资源服务将以 localhost 和本地 Ip 进行启动,此时我们可以通过 localhost:

    2024年02月03日
    浏览(33)
  • vue3之vite创建h5项目1(创建vite项目、配置IP访问项目、配置多环境变量与预览打包生产效果、配置别名)

    初始化项目模块 添加环境变量文件,每个文件写入配置,定义 env 环境变量前面必须加 VITE_ dev环境 test环境 prod环境 在项目根目录下创建 03-1:配置多环境变量之dev环境 .env.development 03-2:配置多环境变量之test环境 .env.test 03-3:配置多环境变量之prod环境 .env.production 03-4 修改

    2024年02月02日
    浏览(77)
  • Vue3 在vite中运行无法使用外部ip访问

    使用vite创建的vue项目运行时,只能使用localhost(127.0.0.1)访问,如果使用外部ip,提示使用–host参数,可使用npm run dev --host,不起作用,在host后增加0.0.0.0也不起作用。需要运行npx vite --host 0.0.0.0。还有一个办法,就是在vite.config.js中增加配置server:

    2024年02月16日
    浏览(44)
  • 树莓派使用Nginx+cpolar内网穿透实现无公网IP访问内网本地站点

    安装 Nginx(发音为“engine-x”)可以将您的树莓派变成一个强大的 Web 服务器,可以用于托管网站或 Web 应用程序。相比其他 Web 服务器,Nginx 的内存占用率非常低,可以在树莓派等资源受限的设备上运行。同时结合cpolar内网穿透工具即可实现无公网IP远程访问。 在树莓派安装

    2024年02月10日
    浏览(43)
  • 使用公网访问内网IIS网站服务器【无需公网IP】

    前言 这里介绍通过内网穿透,实现公网访问内网IIS网站服务器。 都知道,现在基本不会被分配到公网IP了,普遍是内网IP。而在没有公网IP的情况下,想要从公网访问在本地的IIS网站服务器,一般都是通过内网穿透。 市面上内网穿透的工具有很多,但是有的会限制流量,或者

    2024年02月13日
    浏览(49)
  • frp内网穿透保姆级配置流程,让客户端电脑可以通过域名或者IP访问本地程序接口

    下载地址:https://github.com/fatedier/frp/releases 1、server_addr中的IP是个人云服器的IP 2、custom_domains是可以使用域名访问 3、adtech.test.link.???.com的域名解析ip是124.221.248.68,这样配置后相当于,adtech.test.link.???.com访问443端口或者8081端口时,就会被转发到客户端 4、frpc.ini是客户端配置文

    2024年02月07日
    浏览(45)
  • 树莓派上使用Nginx通过内网穿透实现无公网IP访问内网本地站点

    最近,我发现了一个超级强大的人工智能学习网站。它以通俗易懂的方式呈现复杂的概念,而且内容风趣幽默。我觉得它对大家可能会有所帮助,所以我在此分享。点击这里跳转到网站。 安装 Nginx(发音为“engine-x”)可以将您的树莓派变成一个强大的 Web 服务器,可以用于

    2024年02月05日
    浏览(97)
  • 如何使用内网穿透实现无公网ip环境访问VScode远程开发

    远程连接服务器的工具有很多,比如XShell、putty等,可以通过ssh来远程连接服务器,但这用于写代码并不方便,可能需要现在本地写好代码后再将源代码传送到服务器运行、服务器上的图片也无法直接查看。 而vscode可以很好的解决这些问题,它的核心组件都运行在远程环境中

    2024年02月04日
    浏览(33)
  • 使用windows搭建WebDAV服务,并内网穿透公网访问【无公网IP】

    自己用Windows Server搭建了家用NAS主机,WebDAV的文件共享方式当然也是必不可少的。 本文使用的是WIN10 专业版。 1.1 打开控制面板,查看方式改为“类别”,进入“程序”,“启用或关闭Windows功能” 1.2 在Internet Information Services(IIS)中勾选“IIS管理控制台”、“Windows身份验证

    2024年02月13日
    浏览(40)
  • vite项目配置本地开发使用https访问,3分钟搞定

    在开发过程中,有时候需要用到一些音视频接口等需要https才能拿到权限,为方便开发过程中调试,这里就介绍几种vite项目快速开启https访问的方式。vite配置项说明文档:开发服务器选项 | Vite 官方中文文档 这个插件仓库地址:https://github.com/vitejs/vite-plugin-basic-ssl 安装依赖

    2024年02月22日
    浏览(70)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包