Без минификации в Vite

Без минификации сборка оставляет код читаемым, и по нему видно исходные имена.

По умолчанию Vite сжимает JavaScript и сокращает имена переменных и функций. Для отладки на сервере или для учебного разбора минификацию иногда отключают. Тогда файл в dist остаётся близок к исходнику, только модули уже связаны в один скрипт.

В настройке запишем build.minify со значением false:

import { defineConfig } from 'vite'

export default defineConfig({
  build: {
    minify: false,
  },
})

В модуле объявим именованную функцию и выведем hello:

function showHello() {
  document.querySelector('#app').textContent = 'hello'
}

showHello()

Выполним сборку:

npm run build

Откроем JavaScript-файл в dist/assets в текстовом редакторе. Строка showHello должна встретиться в тексте как имя функции, а не как одна буква после минификации. На странице по-прежнему отображается hello.

Добавьте функцию showReady, которая выводит ready в #app, отключите минификацию, соберите проект и найдите имя showReady в итоговом JavaScript-файле.

Включите минификацию по умолчанию, пересоберите тот же проект и сравните: имя showReady в файле сборки исчезло или сильно сократилось.