如何将Next.js应用构建产物作为另一个Next.js应用的依赖？

方案一：将构建产物打包为轻量npm包（推荐） #

这是最规范的方式，能避免引入多余依赖，同时方便版本管理：

• 优化源项目配置：
  1. 在源Next.js项目的package.json中，添加files字段，明确只包含构建产物和必要运行文件：

     "files": [
       ".next",
       "public",
       "package.json",
       "next.config.js" // 若需共享配置则保留
     ]
     

  2. 清理dependencies，只保留运行时必须的依赖（比如react、react-dom、next），将所有开发依赖（如eslint、typescript等）移至devDependencies，这类依赖不会被打包进发布的npm包。
  3. 添加prepare脚本，确保发布前自动完成构建：

     "scripts": {
       "prepare": "next build"
     }
     

• 发布npm包：
  执行npm publish（私有包需配置对应私有npm仓库），此时发布的包仅包含构建产物和必要依赖，体积大幅压缩。
• 在目标项目中使用：
  安装该包：npm install <你的包名>，之后可直接引用包内静态资源；若需复用页面/组件，在目标项目的next.config.js中配置transpilePackages：

  /** @type {import('next').NextConfig} */
  const nextConfig = {
    transpilePackages: ['<你的包名>'],
  }
  
  module.exports = nextConfig
  

方案二：本地文件依赖（适合开发阶段快速测试） #

若不想发布到npm，可直接引用本地构建产物：

1. 在源项目执行next build生成最新构建产物。
2. 在目标项目的package.json中添加本地依赖：

   "dependencies": {
     "my-next-build": "file:../path/to/your-source-project"
   }
   

3. 执行npm install，目标项目会直接引用本地构建产物目录，不会引入多余依赖。注意每次源项目更新构建产物后，需重新执行npm install或npm update my-next-build同步变更。

注意事项 #

• 确保源项目和目标项目的Next.js版本、Node.js版本一致，避免构建产物兼容性问题。
• 若源项目构建产物包含服务端代码，目标项目需保证运行环境与源项目一致（如部署平台的Node版本）。

内容的提问来源于stack exchange，提问作者Bibhu