Next.js - CLI dev 命令

在 Next.js CLI 中，`dev' 命令用于为 Next.js 应用程序设置开发服务器。此命令有几个选项可以自定义行为或开发环境。在本章中，我们将解释如何使用 `dev` 命令设置可自定义的 Next.js 环境。

Next.js Dev 命令语法

以下是 Next.js CLI 中 dev 命令的语法。

npx next dev [options]

例如，`npx next dev -p 3001`，此处端口号 3001 是 `dev` 命令的一个 `选项`。

Dev 命令的选项

以下是 `dev` 命令可用的选项列表。

选项	说明
-h, --help	列出所有可用选项。
[directory]	用于指定构建应用程序的目录。如果未提供，则使用当前目录。
--turbopack	使用 Turbopack 启动开发模式。
-p 或 --port	指定启动应用程序的端口号。默认值:3000，env:PORT
-H 或 --hostname	指定启动应用程序的主机名。有助于使应用程序可用于网络上的其他设备。默认值:0.0.0.0
--experimental-https	使用 HTTPS 启动服务器并生成自签名证书。
--experimental-https-key	指定 HTTPS 密钥文件的路径。
--experimental-https-cert	指定 HTTPS 证书文件的路径。
--experimental-https-ca	指定 HTTPS 证书颁发机构文件的路径。
--experimental-upload-trace	将调试跟踪的子集报告给远程 HTTP URL。

使用 Dev 命令更改默认主机名

在 Next.js 中，我们可以使用 dev 命令更改开发服务器的默认主机名。以下是更改默认主机名的语法。

npx next dev -H 127.0.35.1

在终端中运行上述命令后，Next.js 开发模式将默认开始在 `http://127.0.35.1:3000/` 上运行。您的默认浏览器将自动打开页面。

示例

服务器准备就绪后，将以下代码粘贴到 `app/page.tsx` 文件中，即可看到您的网站在更新后的主机名上运行。

// app/page.tsx

export default function Home() {
    return (
        <div>
            <h1>Welcome to My Next.js App</h1>
            <p>This is the home page.</p>
        </div>
    );
  }

输出

在输出中，您可以看到 Next.js 服务器正在主机 127.0.35.1 上运行。

使用 Dev 命令更改默认端口

在 Next.js 中，我们可以使用 dev 命令更改开发服务器的默认端口。以下是更改默认端口号的语法。

npx next dev -p 4000

在终端中运行上述命令后，Next.js 开发模式将开始在 `http://localhost:4000/` 上运行。您的默认浏览器将自动打开该页面。

示例

服务器准备就绪后，将以下代码粘贴到 `app/page.tsx` 文件中，即可看到您的网站在端口 4000 上运行。

// app/page.tsx

export default function Home() {
    return (
        <div>
            <h1>Welcome to My Next.js App</h1>
            <p>This is the home page.</p>
        </div>
    );
  }