1:创建项目安装官网步骤
npx create-next-app@latest

2:修改next.config.mjs配置文件

/** @type {import('next').NextConfig} */
const nextConfig = {
    output: 'export',
    basePath: '/test',
};

export default nextConfig;

3:修改package.json配置文件

{
  "name": "uniweb-payment-link-frontend",
  "version": "0.1.0",
  "private": true,
  "homepage": "https://merchant-stage.uniwebpay.com/test",
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "react": "^18",
    "react-dom": "^18",
    "next": "14.2.3"
  },
  "devDependencies": {
    "typescript": "^5",
    "@types/node": "^20",
    "@types/react": "^18",
    "@types/react-dom": "^18",
    "postcss": "^8",
    "tailwindcss": "^3.4.1",
    "eslint": "^8",
    "eslint-config-next": "14.2.3"
  }
}

4:更改page.tsx文件

'use client'
import Image from "next/image";
import Login from "./login";
import './globals.css'

export default function Home() {
  return (
    <main className="flex min-h-screen flex-col items-center justify-between p-24 bg-white">
       <Login/>
    </main>
  );
}

5:运行编译命定

npm ru build

6:把输出out文件放到nginx文件目录上/var/www/test/

7:修改nginx default配置文件

location /test {
alias /var/www/test/;
}

8:域名访问地址
https://xxx.xx.com/test