如何自动将Git分支名称添加至首页注释？

Absolutely! Automatically injecting your Git branch name into your homepage’s comments is totally feasible, and it’ll wipe out those frustrating manual errors that come with forgetting to update it. Let’s break down practical solutions based on common project setups:

1. Frontend Projects (Webpack/Vite) #

Most modern frontend build tools let you inject environment variables at build time, which we can use to pass the Git branch name directly into your homepage.

For Webpack: #

1. First, fetch the current Git branch in your webpack.config.js using Node.js's child_process:

   const { execSync } = require('child_process');
   const gitBranch = execSync('git rev-parse --abbrev-ref HEAD').toString().trim();
   

2. Use Webpack's DefinePlugin to make this branch name available globally:

   module.exports = {
     // ... other config
     plugins: [
       new webpack.DefinePlugin({
         'process.env.GIT_BRANCH': JSON.stringify(gitBranch),
       }),
       // ... other plugins
     ],
   };
   

3. Add the branch name to your homepage’s HTML (either directly in your template or via a JS-injected comment):

   <!-- Current Git Branch: <%= process.env.GIT_BRANCH %> -->
   <!-- Or if using HtmlWebpackPlugin with an EJS template -->
   

For Vite: #

1. Fetch the branch name in your vite.config.js:

   import { defineConfig } from 'vite';
   import { execSync } from 'child_process';
   
   const gitBranch = execSync('git rev-parse --abbrev-ref HEAD').toString().trim();
   
   export default defineConfig({
     define: {
       '__GIT_BRANCH__': JSON.stringify(gitBranch),
     },
   });
   

2. Reference it directly in your index.html:

   <!-- Current Git Branch: __GIT_BRANCH__ -->
   

2. Backend-Rendered Pages (e.g., Spring Boot) #

For backend projects that render HTML templates, you can fetch the Git branch during build time and pass it to your template.

Example with Spring Boot & Maven: #

1. Add the git-commit-id-plugin to your pom.xml to capture Git metadata (including the branch name):

   <build>
     <plugins>
       <plugin>
         <groupId>pl.project13.maven</groupId>
         <artifactId>git-commit-id-plugin</artifactId>
         <version>4.9.1</version>
         <executions>
           <execution>
             <goals>
               <goal>revision</goal>
             </goals>
           </execution>
         </executions>
       </plugin>
     </plugins>
   </build>
   

2. Inject the branch name into your controller and pass it to your Thymeleaf/Freemarker template:

   @Controller
   public class HomeController {
     @Value("${git.branch}")
     private String gitBranch;
   
     @GetMapping("/")
     public String home(Model model) {
       model.addAttribute("gitBranch", gitBranch);
       return "home";
     }
   }
   

3. Add the comment to your template:

   <!-- Current Git Branch: ${gitBranch} -->
   

3. Universal Git Hook Approach (Works for Any Project) #

If you want a solution that works regardless of your tech stack, use Git hooks to automatically update the homepage comment whenever you switch branches or make commits.

1. Create a shell script (e.g., update-branch-comment.sh) in your project root:

   #!/bin/bash
   BRANCH=$(git rev-parse --abbrev-ref HEAD)
   # Replace index.html with your actual homepage file path
   sed -i.bak "s/<!-- Current Git Branch: .* -->/<!-- Current Git Branch: $BRANCH -->/" index.html
   # Clean up the backup file created by sed
   rm index.html.bak
   

2. Make the script executable:

   chmod +x update-branch-comment.sh
   

3. Link this script to Git's post-checkout (triggers when switching branches) and pre-commit (triggers before committing) hooks:

   cp update-branch-comment.sh .git/hooks/post-checkout
   cp update-branch-comment.sh .git/hooks/pre-commit
   

Pro Tip: #

In CI/CD environments, skip running git commands directly and use your CI tool's built-in environment variables instead (e.g., GITHUB_REF_NAME for GitHub Actions, CI_COMMIT_BRANCH for GitLab CI). This avoids potential issues with Git repository access in the pipeline.

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