IIS + Nextjs项目初始化

该记录适用于使用IIS部署前端项目的方案， 使用docker部署项目在需要忽略添加了（忽略）tag 的操作。

1. 创建项目

   mkdir projectName && cd projectName
   yarn create next-app .

2. 添加开发依赖

   yarn add -D prettier prettier-plugin-tailwindcss husky lint-staged

3. 配置prettier依赖

   node --eval "fs.writeFileSync('.prettierrc','{}\n')"

   添加下面的代码到.prettierrc中

   {
     "printWidth": 80,
     "tabWidth": 2,
     "useTabs": false,
     "semi": true,
     "singleQuote": true,
     "trailingComma": "all",
     "bracketSpacing": true,
     "jsxBracketSameLine": false,
     "arrowParens": "always",
     "proseWrap": "preserve",
     "endOfLine": "lf",
     "plugins": ["prettier-plugin-tailwindcss"]
   }

4. 配置husky

   npx husky init

   添加下面的代码到package.json中

   ...
   "lint-staged": {
       "**/*": "prettier --write --ignore-unknown"
     }
   ...

   将下面的代码添加到.husky/pre-commit文件中

   # .husky/pre-commit
   #!/bin/sh
   . "$(dirname "$0")/_/husky.sh"
   
   npx lint-staged

5. 配置web.config （忽略）

   <?xml version="1.0" encoding="UTF-8"?>
   <configuration>
       <system.webServer>
           <rewrite>
                   <rules>
                       <rule name="API url rewrite">
                           <match url="^api/(.*)" />
                           <conditions>
                               <add input="{PATH_INFO}" pattern="^/api/(.*)" />
                           </conditions>
                           <action type="Rewrite" url="【后端服务】/api/{R:1}" />
                   </rule>
           </rules>
       </rewrite>
   </system.webServer>
   </configuration>

6. 配置next.config.ts （忽略）

   import type { NextConfig } from 'next';
   const nextConfig: NextConfig = {
     /* config options here */
     output: 'export',
     distDir: 'out',
   };
   
   export default nextConfig;

7. 配置迁移迁移web.config脚本addConfigFile.mjs （忽略）

   'use strict';
   
   import path from 'path';
   import fs from 'fs';
   import { fileURLToPath } from 'url';
   
   const __filename = fileURLToPath(import.meta.url);
   const __dirname = path.dirname(__filename);
   
   const outputDir = path.join(__dirname, 'out');
   
   if (!fs.existsSync(outputDir)) {
     fs.mkdirSync(outputDir, { recursive: true });
   }
   
   fs.copyFileSync(
     path.join(__dirname, 'web.config'),
     path.join(outputDir, 'web.config')
   );
   
   console.log('web.config 文件已成功复制到:', outputDir);

8. 配置分发脚本 deploy.mjs （忽略）

   'use strict';
   import { exec } from 'child_process';
   import path from 'path';
   import { fileURLToPath } from 'url';
   
   const __filename = fileURLToPath(import.meta.url);
   const __dirname = path.dirname(__filename);
   const outputDir = path.join(__dirname, 'out');
   // 构造 SCP 命令
   const scpCommand = `scp -r ${outputDir}/* 【用户名】@【服务器IP】:【项目部署路径】`;
   
   // 执行 SCP 命令
   exec(scpCommand, (error, stdout, stderr) => {
     if (error) {
       console.error(`执行错误: ${error.message}`);
       return;
     }
     if (stderr) {
       console.error(`错误输出: ${stderr}`);
       return;
     }
     console.log(`标准输出: ${stdout.length === 0 ? '发布成功' : stdout}`);