用Nx搭建一个Monorepo项目

Monorepo项目 #

workspace #

pnpx create-nx-workspace --allPrompts=true --defaultBase=master --nxCloud=skip --e2eTestRunner=none

• defaultBase=master 使用master 作为git 主分支
• e2eTestRunner=none 不需要 e2e 测试
• nxCloud=skip 不用 NX云服务

创建Nextjs 前端项目 #

nx add @nx/next
nx g @nx/next:app --unitTestRunner=none --e2eTestRunner=none

• e2eTestRunner=none //不需要 e2e 测试
• unitTestRunner=none //不需要单元测试

创建nodejs 后端项目 #

以 honojs 为例

nx add @nx/node
nx g @nx/node:application --unitTestRunner=none --e2eTestRunner=none  hono-server

// prisma插件
pnpm add -D @nx-tools/nx-prisma
nx g @nx-tools/nx-prisma:init hono-server && nx prisma-generate hono-server

Nx 常用命令 #

移动项目目录

nx g @nx/workspace:move --project hono-server --destination apps/server

package.json 快速配置常用命令

{
  "scripts": {
    "dev": "nx run-many --target=dev",
    "dev:admin": "nx run-many --target=dev --projects=admin,server",
    "build": "nx run-many --target=build --configuration=production",
    "build:admin": "nx build:production admin",
    "serve": "nx run-many --target=serve --configuration=production",
    "reset": "nx reset"
  }
}

附 #

project.json > targets #

Nextjs 项目

{
  "dev": {
    "builder": "@nrwl/next:server",
    "defaultConfiguration": "development",
    "options": {
      "port": 4200,
      "hostname": "localhost"
    }
  },
  "build": {
    "executor": "@nx/next:build",
    "outputs": [
      "{options.outputPath}"
    ],
    "defaultConfiguration": "development",
    "options": {
      "outputPath": "dist/test/admin"
    },
    "configurations": {
      "development": {
        "outputPath": "dist/test/admin"
      },
      "production": {
        "outputPath": "dist/prod/admin"
      }
    }
  },
  "serve": {
    "executor": "@nx/next:server",
    "defaultConfiguration": "production",
    "options": {
      "port": 4200,
      "buildTarget": "admin:build",
      "dev": false
    },
    "configurations": {
      "development": {
        "buildTarget": "admin:build:development",
        "dev": true
      },
      "production": {
        "buildTarget": "admin:build:production",
        "dev": false
      }
    }
  }
}

Node 项目

{
  "build": {
    "cache": false,
    "executor": "@nx/esbuild:esbuild",
    "outputs": [
      "{options.outputPath}"
    ],
    "defaultConfiguration": "development",
    "options": {
      "platform": "node",
      "outputPath": "dist/prod/server",
      "format": [
        "cjs"
      ],
      "bundle": false,
      "main": "apps/server/src/main.ts",
      "tsConfig": "apps/server/tsconfig.app.json",
      "assets": [
        "apps/server/src/assets"
      ],
      "generatePackageJson": true,
      "esbuildOptions": {
        "sourcemap": true,
        "outExtension": {
          ".js": ".js"
        }
      }
    },
    "configurations": {
      "development": {
        "outputPath": "dist/test/server"
      },
      "production": {
        "outputPath": "dist/prod/server",
        "esbuildOptions": {
          "sourcemap": false,
          "outExtension": {
            ".js": ".js"
          }
        }
      }
    }
  },
  "dev": {
    "executor": "@nx/js:node",
    "defaultConfiguration": "development",
    "options": {
      "buildTarget": "server:build"
    },
    "configurations": {
      "development": {
        "buildTarget": "server:build:development"
      },
      "production": {
        "buildTarget": "server:build:production"
      }
    }
  },
  "serve": {
    "executor": "@nx/js:node",
    "defaultConfiguration": "production",
    "options": {
      "port": 8787,
      "buildTarget": "server:build",
      "inspect": false
    },
    "configurations": {
      "development": {
        "buildTarget": "server:build:development"
      },
      "production": {
        "buildTarget": "server:build:production"
      }
    }
  }
}