要配置webpack允许局域网访问项目,你需要做以下几个步骤:
 
1. 在webpack配置文件中,找到devServer选项,并设置其属性`host`为`0.0.0.0`。这将允许其他设备通过局域网IP访问你的项目。
module.exports = {
// ...
devServer: {
host: '0.0.0.0',
// ...
},
// ...
};
2. 在终端中运行`npm run dev`启动开发服务器。
 
3. 在你的设备的终端中,运行`ifconfig`(macOS/Linux)或`ipconfig`(Windows)命令,找到你的局域网IP地址。
 
4. 在其他设备上的浏览器中输入你的局域网IP地址加上开发服务器监听的端口号(默认是8080),例如`http://192.168.1.100:8080`。现在其他设备应该能够访问你的项目了。
 
请注意,一些防火墙设置可能会阻止其他设备访问你的项目。如果你遇到问题,请检查你的防火墙设置或尝试在其他网络环境中进行测试。
 

webpack配置局域网访问项目的更多相关文章

  1. vue全家桶安装以及修改webpack配置新增vue项目启动方式

    一.安装node环境(自带npm) 下载地址 二.替换下载源 // 淘宝 NPM 镜像 npm install -g cnpm --registry=https://registry.npm.taob ...

  2. xampp for mac配置局域网访问

    下载了xampp,之前在window上面经常用.后来用了mac下载xampp后,配置局域网总是没成功.现在配置好了,来和大家分享一下配置局域网访问步骤. 1. 下载 下载地址:https://www. ...

  3. Linux下Apache配置局域网访问出现的问题

    在网站安装好之后,本机可以访问,但是局域网内无法访问,我查看了 /etc/httpd/conf/httpd.conf 看到我的配置如下 <Directory ......> Allow A ...

  4. wampserver环境配置局域网访问

    安装好wamp后,想用手机通过局域访问电脑上wamp下的网页,结果出现如下提示403错误: 第一步:找到 conf 这个文件: 找到下图中红色方框中的onlineoffline tag - don’t ...

  5. wamp配置局域网访问

    Apache的版本是2.4.9. <Directory "D:/wamp/www/">    #    # Possible values for the Option ...

  6. apache配置局域网访问

    1.配置vhost.conf NameVirtualHost 192.168.2.74:80 <VirtualHost 192.168.2.74:80> DocumentRoot /var ...

  7. .NET Core项目部署到Linux(Centos7)(九)防火墙配置,允许外网或局域网访问.NET Core站点

    目录 1.前言 2.环境和软件的准备 3.创建.NET Core API项目 4.VMware Workstation虚拟机及Centos 7安装 5.Centos 7安装.NET Core环境 6. ...

  8. webstrom vue项目让局域网访问

    vue项目package.json "dev": "webpack-dev-server --inline --progress --config build/webpa ...

  9. @vue/cli 3.x项目脚手架 webpack 配置

    @vue/cli  是一个基于 Vue.js 进行快速开发的完整系统. @vue/cli   基于node服务  需要8.9以上版本 可以使用 nvm等工具来控制node版本  构建于 webpack ...

  10. Apollo配置中心拉取,通过单独打包解决 Get config services failed from http://阿里云局域网访问IP:8080/services/config?appId=MyAppId&ip=192.168.145.1 Cause Could not complete get operation

    Apollo配置中心拉取,通过单独打包解决 Get config services failed from http://阿里云局域网访问IP:8080/services/config?appId=M ...

随机推荐

  1. TodoList - 开源研究系列文章

    接着上次的代码,整理出一个待办列表的程序,比较简单易用,读者可自行修改成自己需要的程序. 1.        项目目录: 目录见下图,对代码进行了划分,比较简单.主处理类在Helper目录里. 2.  ...

  2. wget: 未找到命令

    输入以下命令: yum -y install wget

  3. 关于在Java中计算某个数的N次方注意事项

    在实际过程中,我们会遇到计算某个数的N次方的情景,在书面上我们是可以记作 a^n ,然而在Java中我们却不能这样使用,因为在Java中,这样的写法是位运算,即 假设 A = 60, B = 13,他 ...

  4. [shell]在curl测试的data参数中引用变量

    在curl测试的data参数中引用变量 前言 在使用curl接口进行接口传参时,常会使用如下方法: #!/bin/bash url="http://192.168.0.10:8000/api ...

  5. struct(C# 参考)

    struct 类型是一种值类型,通常用来封装小型相关变量组,例如,矩形的坐标或库存商品的特征. 下面的示例显示了一个简单的结构声明. 1 public struct Book 2 { 3 public ...

  6. 形象谈JVM-第二章-认识编译器

    我在上一章<形象谈JVM-第一章-认识JVM>提到的"翻译",其实就是我们今天所说的"编译"的概念. 上一章原文链接:https://www.cnb ...

  7. 老问题了:idea中使用maven archetype新建项目时卡住

    背景 作为一个后端Java打工人,idea就是最重要的打饭工具.创建项目,熟悉吧,但是,这么多年下来,因为idea换了版本,电脑换了等等,我还是时不时遇到根据maven archetype新建mave ...

  8. vue3+vite2动态绑定图片优雅解决方案

    优雅解决方案在最下面,小伙伴们儿可以直接前往 背景 在vue3+vite2项目中,我们有时候想要动态绑定资源,比如像下面的代码这样: <template> <div> < ...

  9. android模拟器推荐

    最近装了个海马模拟器用来调试cocos2dx-lua游戏. 安装完之后发现, 我之前装的virtual box被替换掉了, 因为海马模拟器要安装它自己匹配版本的virtual box, 所以我之前的装 ...

  10. python开发实战——ip池

    前言代理IP池是一组可用的代理IP地址,用于访问网站或执行其他网络请求.它可以帮助我们在网络请求时隐藏我们的真实IP地址,从而提高网络安全性.匿名性和稳定性.同时,代理IP池还可以通过定时更新和测试代 ...