npm——利用serve实现真机调试

文章目录

  • 目标
  • serve
  • 简单使用
  • 是不是任意服务器都可以呢?
  • 如何获取这个IP地址?
  • 外网怎么办?
  • 用这功能还能做什么?

目标

写了一个网页,需要在移动端进行测试。

PC与手机在同一个WIFI下。

serve

是一个快速启动静态服务器的npm包。

简单使用

准备一个index.html:

doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"
		  name="viewport">
	<meta content="ie=edge" http-equiv="X-UA-Compatible">
	<title>Documenttitle>
head>
<body>
<h1>你好,世界!h1>
body>
html>

启动服务器:

npx serve

效果:
第一个是本机访问的地址。
第二个是局域网内访问的地址。

npm——利用serve实现真机调试_第1张图片

PC端:

npm——利用serve实现真机调试_第2张图片
移动端:

npm——利用serve实现真机调试_第3张图片

是不是任意服务器都可以呢?

为此,我又建了一个parcel项目。
端口是1234。

npm——利用serve实现真机调试_第4张图片
PC端:

npm——利用serve实现真机调试_第5张图片
移动端:IP不变,改端口号。

npm——利用serve实现真机调试_第6张图片
看来是可以的。

如何获取这个IP地址?

命令行:

ipconfig

找:IPv4地址。
npm——利用serve实现真机调试_第7张图片

外网怎么办?

简单的方式还是开热点,转换成内网。

用这功能还能做什么?

局域网文件传输,不需要互联网。

你可能感兴趣的:(涉猎百家,开发语言,青少年编程,javascript)