AI Engineering Tools

编程

开发服务器与部署术语

了解本地开发服务器、网络 URL、端口、构建、部署、警告与常见 Web 错误。

42 个项目

本地开发

localhost

localhost

http://localhost:3001

含义

一个主机名,指向运行浏览器或命令的同一台计算机。

用途

在检查同一 Mac 或 PC 上的网站时,请使用 localhost。

注意

手机和平板电脑有自己的本地地址,因此它们无法使用 Mac 设备的本地地址。

示例

http://localhost:3001

请求示例

在 localhost 上打开本地站点,并检查新的参考页面。

本地开发

127.0.0.1

127.0.0.1

http://127.0.0.1:3001

含义

一个环回 IP 地址,也指向同一本地计算机。

用途

它通常可以与 localhost 互换,用于同一设备的测试。

示例

http://127.0.0.1:3001

请求示例

如果localhost无法正确解析,请尝试127.0.0.1。

本地开发

开发服务器

Dev server

npm run dev

含义

用于开发的服务器,具有快速重建和仅用于开发的功能。

用途

使用它在构建或部署网站之前预览更改。

注意

开发服务器的行为并不总是与部署的生产环境行为完全相同。

示例

npm run dev

请求示例

启动开发服务器,以便我可以在我的 iPhone 上查看该页面。

本地开发

端口

Port

http://localhost:3001

含义

一个用于标识哪个服务器进程应该接收到机器上的连接的数字。

用途

如果一个服务器使用 3001 端口,另一个服务器必须使用不同的端口,例如 3002。

示例

http://localhost:3001

请求示例

如果 3001 端口已被占用,请启动开发服务器并使用其他端口。

本地开发

本地 URL

Local URL

Local: http://localhost:3001

含义

从运行开发服务器的同一设备使用的地址。

用途

对于开发机器上的桌面浏览器检查,请使用 Local URL。

示例

Local: http://localhost:3001

请求示例

在启动开发服务器后,告诉我 Local URL。

网络访问

网络 URL

Network URL

Network: http://172.30.1.55:3001

含义

一个其他设备在同一网络上使用的地址,用于访问开发服务器。

用途

在从 iPhone、iPad 或同一 Wi-Fi 上的另一台计算机检查网站时使用。

注意

开发服务器必须监听网络可访问的主机,例如 0.0.0.0。

示例

Network: http://172.30.1.55:3001

请求示例

使用网络 URL 启动开发服务器,以便我可以在我的 iPad 上进行测试。

网络访问

IP 地址

IP address

172.30.1.55

含义

一个用于标识网络中设备的数字地址。

用途

一个 LAN IP 地址允许同一 Wi-Fi 上的其他设备访问您的开发服务器。

注意

本地网络 IP 地址可能会在 Wi-Fi 或路由器条件发生变化时发生变化。

示例

172.30.1.55

请求示例

在为设备测试添加 allowedDevOrigins 时,请使用当前的 LAN IP。

网络访问

主机

Host

--hostname 0.0.0.0

含义

服务器开始侦听请求时绑定的地址。

用途

绑定到 0.0.0.0 允许开发服务器从网络中的其他设备访问。

示例

--hostname 0.0.0.0

请求示例

使用主机名 0.0.0.0 运行开发服务器,以便进行手机测试。

网络访问

相同的网络

Same network

相同的 Wi-Fi 下的 Mac 和 iPhone

含义

连接到同一本地网络的设备,通常是同一 Wi-Fi 路由器。

用途

只有当网络设置允许时,手机才能访问 Mac 设备的服务器。

示例

相同的 Wi-Fi 下的 Mac 和 iPhone

请求示例

在调试网站之前,检查 iPhone 和 Mac 是否在同一网络上。

Next.js 行为

allowedDevOrigins

allowedDevOrigins

allowedDevOrigins: ['172.30.1.55']

含义

一个 Next.js 开发设置,允许特定的源访问开发资源。

用途

在使用 LAN IP 从手机或平板电脑测试 Next 开发服务器时,可能需要它。

注意

这是一个开发环境设置。 部署的静态站点不使用相同的开发资源访问路径。

示例

allowedDevOrigins: ['172.30.1.55']

请求示例

将我的当前 LAN IP 地址添加到 allowedDevOrigins 以进行开发测试。

网络访问

跨域

Cross-origin

Blocked cross-origin request

含义

跨域请求,其中方案、主机或端口不同。

用途

开发工具默认情况下可能会阻止对敏感开发资源的跨域访问。

示例

Blocked cross-origin request

请求示例

解释这个跨域警告是否会影响生产部署。

Next.js 行为

HMR

HMR

/_next/webpack-hmr

含义

热模块替换 (Hot Module Replacement) 在开发过程中无需完全重新加载即可更新浏览器。

用途

如果 HMR 开发资源被阻止,页面可能会加载,但交互式更新或脚本在开发过程中可能会出现异常。

注意

HMR 仅用于开发,不包含在最终的静态导出中。

示例

/_next/webpack-hmr

请求示例

检查 iPhone 问题是否由阻止的 HMR 开发资源引起的。

Next.js 行为

Turbopack

Turbopack

Next.js 16.2.5 (Turbopack)

含义

一个由 Next.js 用于开发和构建工作流程的打包工具。

用途

您可能会在开发服务器或构建输出中看到它的名称。

示例

Next.js 16.2.5 (Turbopack)

请求示例

总结 Turbopack 的输出,并告诉我构建是否成功。

Next.js 行为

应用路由器

App Router

src/app/[locale]/reference/page.tsx

含义

基于应用程序目录的 Next.js 路由系统。

用途

在文件夹下添加一个 page.tsx 文件会创建一个路由。

示例

src/app/[locale]/reference/page.tsx

请求示例

使用 App Router 文件夹结构添加新的参考页面。

Next.js 行为

generateStaticParams

generateStaticParams

generateStaticParams()

含义

一个 Next.js 函数,用于声明应该在构建时生成哪些动态路由。

用途

区域页面使用它来创建 /en、/ko、/ja 以及其他语言路径。

示例

generateStaticParams()

请求示例

确保新的参考页面具有适用于所有区域的 generateStaticParams。

构建与输出

构建

Build

npm run build

含义

编译并准备网站以进行生产或静态输出的过程。

用途

在部署之前运行构建,以检测 TypeScript、路由和静态生成问题。

示例

npm run build

请求示例

运行构建过程,并确认是否生成了新的路由。

构建与输出

代码检查

Lint

npm run lint

含义

一种静态代码检查,用于检测样式、正确性和框架规则问题。

用途

代码检查是在构建或提交之前的快速检查。

示例

npm run lint

请求示例

在编辑参考页面后,运行 lint 工具。

构建与输出

静态导出

Static export

output: "export"

含义

一种构建输出,其中页面以静态文件形式生成,而不是需要运行服务器。

用途

静态导出适用于将站点托管为预构建的 HTML、CSS 和 JavaScript 文件。

注意

某些仅在服务器端运行的功能与静态导出不兼容。

示例

output: "export"

请求示例

保持新页面与静态导出兼容。

构建与输出

SSG

SSG

● (SSG) prerendered as static HTML

含义

静态站点生成在构建时创建页面。

用途

为每个区域生成引用页面,这些页面在构建过程中使用 `generateStaticParams`。

示例

● (SSG) prerendered as static HTML

请求示例

确认参考路由在构建输出中显示为 SSG。

构建与输出

预渲染

Prerender

预渲染为静态内容

含义

在用户请求之前渲染页面,通常在构建过程中。

用途

预渲染的页面加载速度快,因为 HTML 已经存在。

示例

预渲染为静态内容

请求示例

检查所有区域页面是否成功预渲染。

构建与输出

捆绑

Bundle

静态 JS 包

含义

组合代码和依赖项,用于浏览器的编译文件。

用途

大型包可能会影响加载速度,并且应该在网站增长时加以关注。

示例

静态 JS 包

请求示例

避免仅为简单的参考页面而添加大型库。

部署

部署

Deploy

部署静态输出

含义

发布已构建的网站,以便用户可以通过网络访问它。

用途

在进行本地检查、代码检查和构建通过后,才会进行部署。

示例

部署静态输出

请求示例

不要立即部署;只需准备页面并运行构建。

部署

生产

Production

production deployment

含义

用户访问的实际部署环境。

用途

生产应该与本地开发服务器进行不同的测试,因为开发服务器上特有的功能在生产环境中不存在。

示例

production deployment

请求示例

解释这个警告是否会影响生产环境,或者仅影响开发环境。

部署

托管

Hosting

静态托管服务提供商

含义

存储和提供已部署网站文件的服务或服务器。

用途

静态导出可以通过静态托管提供,当不需要服务器逻辑时。

示例

静态托管服务提供商

请求示例

确保输出在静态托管环境中有效。

部署

领域

Domain

example.com

含义

用户键入以访问站点的可读地址。

用途

一个域名指向通过 DNS 部署的托管位置。

示例

example.com

请求示例

不要将 localhost 硬编码到应该在生产环境域名上工作的链接中。

部署

DNS

DNS

记录 / CNAME 记录

含义

将域名映射到服务器或托管目标的系统。

用途

为了使自定义域名访问已部署的站点,必须正确配置 DNS。

示例

记录 / CNAME 记录

请求示例

解释问题是 DNS 问题还是应用构建问题。

部署

缓存

Cache

clear browser cache

含义

存储文件的副本或用于加快页面加载的响应。

用途

在部署后,旧的缓存文件可能会导致浏览器在一段时间内显示旧版本。

示例

clear browser cache

请求示例

检查旧页面是否仍然显示,因为缓存问题。

运行环境

Node.js

Node.js

node --version

含义

一种 JavaScript 运行时环境,用于运行开发工具、构建脚本和服务器。

用途

Next.js 的 dev 和 build 命令在 Node.js 上运行。

示例

node --version

请求示例

请告诉我,这个警告是来自 Node.js、Next.js,还是我的应用程序代码。

运行环境

npm

npm

npm run build

含义

一个常用的 JavaScript 项目中的包管理器和脚本运行器。

用途

package.json 定义了 npm 可以运行的脚本,例如 dev、lint 和 build。

示例

npm run build

请求示例

运行 npm build 脚本,并总结结果。

运行环境

package.json

package.json

"scripts": { "dev": "next dev -p 3001" }

含义

一个定义脚本、依赖项和包元数据的项目文件。

用途

检查 package.json 文件,以了解项目期望您运行哪些命令。

示例

"scripts": { "dev": "next dev -p 3001" }

请求示例

在决定运行哪个开发命令之前,请检查 package.json 文件。

运行环境

环境变量

Environment variable

NEXT_PUBLIC_SITE_URL=https://example.com

含义

传递给应用程序或构建环境的,不在源代码之外的值。

用途

环境变量用于站点 URL、API 密钥和特定于部署的设置。

注意

密钥不应通过公共客户端变量暴露。

示例

NEXT_PUBLIC_SITE_URL=https://example.com

请求示例

如果已经存在环境变量,不要硬编码生产环境的 URL。

错误与警告

404

404

404 Not Found

含义

一个错误,表示请求的页面或文件未找到。

用途

当路由被删除、重命名或未在静态输出中生成时,可能会发生这种情况。

示例

404 Not Found

请求示例

检查删除后,旧的 programming-basics URL 是否现在返回 404 错误。

错误与警告

500

500

500 Internal Server Error

含义

一个错误,表示服务器在处理请求时发生故障。

用途

在开发过程中,终端或浏览器通常会显示原始错误。

示例

500 Internal Server Error

请求示例

如果出现 500 错误,请检查终端错误,并确定导致错误的文件的位置。

错误与警告

Module not found

Module not found

Module not found: Can't resolve '@/lib/programming'

含义

一个错误,表示导入指向一个无法找到的文件或包。

用途

这通常发生在移动、删除或重命名文件,但没有更新导入语句之后。

示例

Module not found: Can't resolve '@/lib/programming'

请求示例

查找并更新所有仍然指向已删除文件的导入。

错误与警告

未找到导出的内容。

Export not found

Export programmingBasicsCopy doesn't exist

含义

一个错误,表示文件存在,但请求的命名导出在该文件中不存在。

用途

当数据对象被重命名,但导入仍然使用旧名称时,可能会发生这种情况。

示例

Export programmingBasicsCopy doesn't exist

请求示例

在所有地方将旧的导出名称替换为新的名称。

错误与警告

EADDRINUSE

EADDRINUSE

listen EADDRINUSE: address already in use 0.0.0.0:3001

含义

一个错误,表示另一个进程正在使用请求的主机和端口。

用途

如果您有意要替换它,请使用另一个端口或停止现有的服务器。

示例

listen EADDRINUSE: address already in use 0.0.0.0:3001

请求示例

如果出现 EADDRINUSE,请告诉我哪个端口正在使用,并使用不同的端口。

错误与警告

DeprecationWarning

DeprecationWarning

[DEP0205] DeprecationWarning: module.register() is deprecated

含义

一个警告,表明 API 目前仍然有效,但可能会被删除或更改。

用途

警告应该引起注意,但它们并不总是构建过程中的错误。

示例

[DEP0205] DeprecationWarning: module.register() is deprecated

请求示例

请告诉我,这个 DeprecationWarning 是否无害,或者是否需要修改代码。

错误与警告

补水

Hydration

Hydration failed because the server rendered HTML didn't match

含义

客户端 JavaScript 连接到服务器渲染的 HTML 的过程。

用途

当服务器和客户端渲染不同的初始内容时,会发生不匹配错误。

示例

Hydration failed because the server rendered HTML didn't match

请求示例

如果补水失败,请检查客户端上哪些组件渲染方式不同。

命令

npm run dev

npm run dev

npm run dev

含义

一个项目脚本,用于启动本地开发服务器。

用途

在编辑页面和本地检查更改时,请使用它。

示例

npm run dev

请求示例

运行 npm run dev,并提供本地和网络 URL。

命令

npm run build

npm run build

npm run build

含义

一个项目脚本,用于创建生产构建或静态导出。

用途

在进行更改后运行它,以确保应用程序可以成功生成。

示例

npm run build

请求示例

运行 npm run build,并总结任何警告或错误。

命令

npm run lint

npm run lint

npm run lint

含义

一个项目脚本,用于运行代码检查。

用途

在构建之前运行它,以便快速发现许多代码问题。

示例

npm run lint

请求示例

在构建网站之前,运行 lint 工具。

命令

curl

curl

curl -I http://localhost:3001/ko

含义

一种命令行工具,用于发送 HTTP 请求并检查响应。

用途

curl can quickly check whether a local or deployed page responds with 200, 404, or another status.

示例

curl -I http://localhost:3001/ko

请求示例

使用 curl 检查新的参考路由是否返回 200。