Published on

用winsw把Next.js网站打包成Windows服务

Authors

今天分享一个网站建设前后端同学都能用的实用技巧:如何用WinSW工具,把Next.js搭建的网站打包成Windows服务,实现开机自启、后台稳定运行,再也不用手动打开命令行启动服务。

最终的网站访问地址:https://banlyai.com/

一、为什么要打包成Windows服务?

我们平时启动Next.js服务,大多是用pnpm start或者npm start命令,这种方式有3个致命问题:

  • 命令行窗口不能关,一关服务就停了;
  • 电脑重启后,需要手动重新输入命令启动;
  • 后台运行不稳定,意外关闭后没有提醒,排查麻烦。

而把Next.js服务打包成Windows服务后,就能解决以上所有问题:

  • 服务后台静默运行,不占用命令行窗口;
  • 支持开机自启,电脑重启后自动恢复服务;
  • 可在Windows服务列表中直接管理启动/停止/重启。

二、准备工作:3个工具提前备齐

开始操作前,先准备好以下3样东西,避免操作到一半卡壳:

1. 已部署好的Next.js项目

确保你的Next.js项目能正常运行:

  • 本地已安装Next.js(建议15或以上版本,和项目依赖兼容);
  • 进入项目根目录,执行 pnpm build 生成构建;
  • 执行 pnpm start 能正常启动服务,浏览器访问对应端口(默认3000)可打开项目。

2. WinSW工具(核心工具)

WinSW是一个轻量的Windows服务包装工具,能把任意可执行程序包装成Windows服务,开源免费,无需安装。

下载步骤:

  • 打开WinSW官方GitHub仓库:https://github.com/winsw/winsw
  • 进入「Releases」页面,下载最新版本的工具(建议下载.exe格式,比如 WinSW-x64.exe);
  • 下载后,把.exe文件复制到你的Next.js项目根目录下。

3. 配置文件(关键步骤)

WinSW需要一个XML配置文件,用来指定服务名称、启动命令、日志路径等信息。这个文件要和刚才下载的WinSW.exe放在同一个目录(Next.js项目根目录)。

三、实操步骤:5步完成打包,超简单!

接下来进入核心操作,每一步都附详细说明,跟着做就行~

1:重命名WinSW工具(可选但推荐)

为了方便后续操作,把下载的 WinSW-x64.exe 重命名为简单好记的名字,比如 banlyaiweb.exe(名字可自定义,我这个是对应我的网站名称)。

2:创建WinSW配置文件

在项目根目录下,新建一个XML文件,文件名必须和刚才重命名的WinSW.exe一致,比如banlyaiweb.xml。

打开XML文件,复制以下内容,然后根据自己的项目信息修改对应参数(重点修改标注的地方):

<service>
  <!-- 1. 服务名称(自定义,在Windows服务列表中显示的名称) -->
  <id>banlyaiweb</id>
  <!-- 2. 服务显示名称(自定义,更直观的描述) -->
  <name>banlyaiweb</name>
  <!-- 3. 服务描述(自定义,说明服务用途) -->
  <description>Next.js搭建的Web服务,开机自启,后台运行</description>

  <!-- 4. 启动命令(关键!指定pnpm路径和Next.js启动命令) -->
  <executable>C:\Program\nodejs\pnpm.cmd</executable>
  <!-- 5. 启动参数 -->
  <arguments>start</arguments>

  <!-- 6. 工作目录(Next.js项目根目录,必须是绝对路径) -->
  <workingdirectory>D:\projects\my-nextjs-project</workingdirectory>

  <!-- 7. 日志配置(服务运行日志,方便排查问题) -->
  <logpath>D:\projects\my-nextjs-project\logs</logpath>
  <logmode>roll</logmode>

  <!-- 8. 故障恢复(服务意外停止后自动重启) -->
  <onfailure action="restart" delay="10000"/>
  <onfailure action="restart" delay="20000"/>
  <onfailure action="none"/>
  <restartdelay>10000</restartdelay>
</service>

步骤3:安装Windows服务

配置文件修改完成后,开始安装服务:

  1. 按住 Shift 键,在项目根目录空白处右键,选择「在此处打开PowerShell窗口」(或命令提示符);
  2. 在窗口中输入命令:.\banlyaiweb.exe install(如果你的exe文件名不是这个,替换成自己的文件名);
  3. 如果没有报错,提示「Successfully installed service 'banlyaiweb'」,说明服务安装成功!

步骤4:启动服务并验证

服务安装完成后,需要手动启动一次(后续会开机自启):

  1. 按下 Win + R 键,输入 services.msc,回车打开Windows服务列表;
  2. 在列表中找到你配置的服务名称(比如 banlyaiweb);
  3. 右键选择「启动」,等待服务状态变成「正在运行」;
  4. 打开浏览器,输入 http://localhost:3000/ 能正常访问项目就说明成功了!

步骤5:设置开机自启(默认已开启,验证一下)

WinSW默认配置的服务是「自动」启动类型,也就是开机自启。可以验证一下:

  1. 在服务列表中,右键你的服务,选择「属性」;
  2. 在「启动类型」下拉框中,确认是「自动」;
  3. 如果不是,改成「自动」,点击「应用」即可。

四、常用操作:服务管理指令(收藏备用)

后续需要管理服务(比如重启、卸载),不用再打开服务列表,直接在项目根目录中执行以下命令即可:

  • 启动服务:.\banlyaiweb.exe start
  • 停止服务:.\banlyaiweb.exe stop
  • 重启服务:.\banlyaiweb.exe restart
  • 卸载服务:.\banlyaiweb.exe uninstall
  • 查看服务状态:.\banlyaiweb.exe status

五、踩坑指南:常见问题及解决方案

操作过程中如果遇到问题,别慌,看看以下常见坑有没有对应的解决方案:

⚠️ 坑1:安装服务时提示「无法找到pnpm」

✅ 解决方案:

  • 检查 pnpm路径是否正确;
  • 通过 where pnpm 命令重新查询pnpm安装路径,复制绝对路径替换;
  • 如果路径中有空格(比如 C:\Program Files\nodejs\pnpm.cmd),不需要加引号,XML会自动识别。

⚠️ 坑2:服务启动失败,状态显示「已停止」

✅ 解决方案:

  • 查看日志:进入配置的logs目录,打开最新的日志文件,根据报错信息排查;
  • 常见原因1:项目根目录路径错误,确保是绝对路径;
  • 常见原因2:端口被占用,修改端口(比如 -p 8080),重启服务;
  • 常见原因3:Next.js项目依赖缺失,进入项目根目录执行 pnpm install 重新安装依赖,再启动服务。

⚠️ 坑3:服务启动后,浏览器无法访问

✅ 解决方案:

  • 检查端口是否正确:确认浏览器访问的端口和配置文件的端口一致;
  • 检查防火墙:Windows防火墙可能拦截了该端口,关闭防火墙或添加端口例外;
  • 检查服务是否真的在运行:在服务列表中确认服务状态是「正在运行」,如果不是,重启服务并查看日志。