@ws-serenity/html-vite-plugin
TypeScript icon, indicating that this package has built-in type declarations

0.0.1 • Public • Published

Перспектива

Можно добавить сюда uglify. Который будет удалять \n\r и комменты

About

Выполняет замену env-переменных в index.html. Умеет по условию добавлять теги. Замена происходит по всему document (и в <head> и <body>)

Input

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta content="width=device-width, initial-scale=1, maximum-scale=1" name="viewport">
        <title>Title</title>
        <!--Просто вставит строковое значение из конфига-->
        <script src="%REACT_APP_CONFIG%"></script>
        <!--С помощью аттрибута "vite-if" можем определять теги, которые должны быть добавлены или удалены в зависимости от env-переменной-->
        <script async type="module" vite-if="%VITE_ENABLE_METRICS%">
            console.log('Меня не будет в разметке');
        </script>
    </head>
    <body>
        <div id="root">
            <!--Неизвестные env-переменные будут также удалены-->
            <div vite-if="%UNKNOWN_ENV%">
                Меня не будет в разметке
            </div>
            <!--Пустые условия также удаляются-->
            <div vite-if="">
                И меня тоже не будет
            </div>
            <!--Можно использовать отрицание перед внедрением переменной-->
            <div vite-if="!%VITE_DISABLE_SMTH%">
                А вот я буду
            </div>
        </div>
        <script src="./src/index.tsx" type="module"></script>
    </body>
</html>

Output

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta content="width=device-width, initial-scale=1, maximum-scale=1" name="viewport">
        <title>Title</title>
        <!--Внедренная переменная из env.REACT_APP_CONFIG-->
        <script src="./config"></script>
    </head>
    <body>
        <div id="root">
            <!--Теги, не соответствующие условиям были удалены-->
            <div vite-if="!false">
                А вот я буду
            </div>
        </div>
        <script src="./src/index.tsx" type="module"></script>
    </body>
</html>

Разрешения и ограничения

Можно

  • менять аттрибут-условие (дефолт vite-if)
  • менять экранирование env-переменных, который должны быть заменены (дефолт %)

Нельзя

  • использовать двойное отрицание (нет обработки [vite-if]="!!ENV")
  • использовать в условии env-переменные, не являющиеся true или false

Ограничение

  • Не выполняется удаление комментариев (возможно, пока что)
  • Не выполняется удаление пробельных символов (возможно, пока что)

Readme

Keywords

none

Package Sidebar

Install

npm i @ws-serenity/html-vite-plugin

Weekly Downloads

0

Version

0.0.1

License

ISC

Unpacked Size

8.21 kB

Total Files

20

Last publish

Collaborators

  • skukartsev
  • ra.vi.an
  • gransly
  • d.duda
  • blablaprincess
  • a.manakina
  • f.ishchenko