Добавление имени git-ветки в webpack сборку

2 мин.

Зачем?

Недавно я столкнулся с тем, что в тестовую сборку нужно было добавить имя текущей git-ветки. Ветки именуются по тикетам, поэтому при тестировании сборки довольно удобно смотреть версию по веткам. Пример названия ветки: bugfix/widget-3034

Сделать это было несложно - всё довольно легко гуглится. Но так как мне нужно хоть что-то написать в блог, я решил этим поделиться. Есть 2 способа:

Очень простой способ

Скачиваем пакет git-revision-webpack-plugin

Запускаем:

npm install --save-dev git-revision-webpack-plugin

И затем настраиваем плагин:

const webpack = require("webpack");
const GitRevisionPlugin = require("git-revision-webpack-plugin");
const gitRevisionPlugin = new GitRevisionPlugin();

const branchName = JSON.stringify(gitRevisionPlugin.branch());

module.exports = {
  plugins: [
    gitRevisionPlugin,
    new webpack.DefinePlugin({
      BRANCHNAME: branchName,
    }),
  ],
};

Простой способ

Этот способ практически ничем не отличается от первого. Разница лишь в том, что вместо использования плагина мы сами получаем название ветки.

const webpack = require("webpack");
const childProcess = require("child_process");

const branchName = childProcess
  .execSync("git rev-parse --abbrev-ref HEAD")
  .toString()
  .trim();

module.exports = {
  plugins: [
    new webpack.DefinePlugin({
      BRANCHNAME: `"${branchName}"`,
    }),
  ],
};

На этом всё.

Подписывайтесь на мой Youtube канал и на Telegram 🙂

Зачем?

Очень простой способ

Простой способ

Поделиться

Поддержать автора

Вам может быть интересно:

Устал от программирования? Поиграй в Wordle в консоли!

How to: CLI App using Typescript & Webpack