掌握前端代码部署状态，告别未知

2023-11-11 01:39:18

单独设置版本信息文件

在项目中创建一个单独的 JavaScript 文件，专门用于存储版本相关的信息。这个文件可以记录每次构建的日期、时间、提交者信息等。通过这个文件，你可以轻松了解每次构建的详细信息。

// version.js
export const buildDate = new Date().toLocaleDateString();
export const buildTime = new Date().toLocaleTimeString();
export const commitHash = '123abc'; // 从版本控制系统中获取

在构建过程中注入版本信息

在构建过程中，将版本信息文件的内容注入到项目代码中。你可以使用构建工具（如 Webpack 或 Rollup）的插件或自定义脚本来实现这一目的。这样，版本信息就会成为项目代码的一部分。

// webpack.config.js
const VersionPlugin = require('webpack-version-plugin');

module.exports = {
  plugins: [
    new VersionPlugin({
      filename: 'version.json',
    }),
  ],
};

从前端代码获取版本信息

在前端代码中，你可以使用 JavaScript 的 fetch() 方法从版本信息文件中获取版本信息。这将使你能够在运行时访问这些信息。

// app.js
fetch('version.json')
  .then((res) => res.json())
  .then((data) => {
    console.log(`构建日期：${data.buildDate}`);
    console.log(`构建时间：${data.buildTime}`);
  });