Next.js - CLI

Next.js 命令行界面 (CLI) 是用于开发、运行、构建和启动 Next.js 应用程序的内置工具。在本章中,我们将讨论 Next.js CLI 命令、CLI 命令的语法以及在 Next.js CLI 中编写命令的示例。

目录

Next.js CLI 语法

Next.js 的 CLI 有两个部分,[命令] 和 [选项]。

npx next [command] [options]
  • 命令: Next.js 有一组预定义命令,例如 dev、build、start 等。
  • 选项: Next.js 中的每个命令都有一组选项。例如,`npx next dev -p 3001`,此处端口号 3001 是 `dev` 命令的一个 `选项`。

Next.js CLI 命令

以下是 Next.js CLI 中使用的所有命令的列表。

命令 说明
dev dev 命令以开发模式启动 Next.js 应用程序,并具有热模块重新加载和错误报告功能。
build 这将为应用程序创建优化的生产版本。
start 在生产模式下启动 Next.js 应用程序。应在启动生产模式之前构建该应用程序。
info 这用于打印有关当前系统的相关信息,可用于报告 Next.js 错误。
lint Lint 命令对 Next.js 目录中的所有文件运行 ESLint。如果您的应用程序中尚未配置 ESLint,它还提供安装任何所需依赖项的指导设置。
telemetry 用于启用或禁用与 Next.js 共享有关一般用途的遥测数据。

更改 Next.js CLI 上的默认端口

要在特定端口上运行 Next.js 应用程序,您可以使用 `dev` 命令和端口号。以下是更改默认端口号的语法。

npx next dev -p 4000

在终端中运行上述命令后,Next.js 开发模式将开始在 `http://localhost:4000/` 上运行。您的默认浏览器将自动打开页面。请参阅图片以供参考。

next.js-change-default-port

示例

服务器准备就绪后,将以下代码粘贴到 `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>
    );
  }

输出

在输出中,您可以看到 Next.js 服务器正在端口 4000 上运行。

next.js-change-default-port-output

在 Next.js 开发模式中使用 HTTPS

默认情况下,Next.js 使用 HTTP 协议进行开发。但是,为了测试某些功能(如 webhook 或身份验证),您可以使用 HTTPS 在本地主机上拥有安全的环境。Next.js 可以使用 --experimental-https 标志通过 next dev 生成自签名证书。以下是命令的语法。

npx next dev --experimental-https

运行上述命令时,Next.js 使用 `mkcert` 生成用于本地开发的自签名证书。这将创建存储在目录中的 CA 根证书。

示例

运行命令后,将以下代码粘贴到 `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-https-connection