AfterPack обфускує JavaScript, який видав ваш бандлер. Встановіть пакет для свого стеку, і ваша звичайна збірка видаватиме обфускований результат. Для всього іншого запустіть npx afterpack@latest на результаті збірки.
Таблиця фреймворків
| Фреймворк | Пакет | Як підключити | Де працює | Результат збірки |
|---|---|---|---|---|
| Next.js | @afterpack/next | withAfterpack(config) | runAfterProductionCompile, усередині next build, після того як Next запише чанки | .next/static/chunks, out/ |
| Vite | @afterpack/vite | afterpackVite() у plugins | generateBundle, у конвеєрі | build.outDir |
| Webpack | @afterpack/webpack | new AfterpackWebpackPlugin() | compilation.hooks.processAssets, у конвеєрі | output.path |
| Rollup | @afterpack/rollup | afterpackRollup() у plugins | generateBundle, у конвеєрі | output.dir або output.file |
| esbuild | @afterpack/esbuild | afterpackEsbuild() у plugins | onEnd, після того як esbuild запише файли | outdir або outfile |
| Astro | @afterpack/astro | afterpack() в integrations | @afterpack/vite у конфігурації Vite від Astro | dist/ |
| Svelte | @afterpack/svelte | afterpackSvelte() у plugins | @afterpack/vite | dist/ |
| SvelteKit | @afterpack/sveltekit | afterpackSveltekit() після sveltekit() | @afterpack/vite | результат адаптера (build/) |
| Vue 3 | @afterpack/vue | afterpackVue() після vue() | @afterpack/vite | dist/ |
| Nuxt 3 | @afterpack/nuxt | modules: ["@afterpack/nuxt"] | @afterpack/vite у конфігурації Vite від Nuxt | .output/public/_nuxt/ |
| Angular v17+ | @afterpack/angular | afterpackAngular() у postbuild-скрипті | окремий прохід після збірки, після того як ng build запише файли | dist/<app>/browser |
| Electron | @afterpack/electron | withAfterpack(config) навколо electron-vite | @afterpack/vite на всіх трьох частинах, один сід | out/ кожної частини |
| Parcel | @afterpack/parcel-optimizer | запис в optimizers у .parcelrc | Optimizer Parcel 2, для кожного бандла, у конвеєрі | distDir Parcel |
Astro, Svelte, SvelteKit, Vue, Nuxt і Angular встановлюють @afterpack/vite або запускають той самий спільний прохід, тож підключати його вручну не потрібно.
Без плагіна
| Стек | Шлях |
|---|---|
| Remix / React Router v7 | Збирається на Vite: використовуйте @afterpack/vite або CLI. |
| Звичайний JS | Немає бандлера, до якого можна підключитися: npx afterpack@latest <dir>. |
Що робить кожна інтеграція
Поведінка за замовчуванням описана у Швидкому старті. Крім неї, кожен плагін і CLI мають спільну поведінку:
- Режим збірки визначається автоматично.
NODE_ENV=productionабоCI=trueобирає продакшн, що вимикає видачу source map. Опублікована карта зводить обфускацію нанівець. - Ті самі артефакти. Одна об'єднана
protectionMap.htmlу внесеному до gitignore.afterpack/і.mapпоруч із кожним файлом, коли карти увімкнено..afterpack/має власний.gitignore; ваш ніколи не редагується.build.backupмає дві форми: CLI на кожному запуску віддзеркалює ваші оригінали в.afterpack/backup/, а плагін, який обфускує файли на диску (@afterpack/next,@afterpack/esbuild,@afterpack/angular), на ваш запит записує сусідній файл.backup.<hash>поруч із результатом. Плагіни, що працюють у конвеєрі, не мають записаного файлу, поруч із яким могла б лежати резервна копія, і попереджають, якщо ви її запитуєте. - Один перемикач, щоб пропустити запуск.
build.autorun: falseзалишає плагін встановленим і пропускає рушій. - Директиви зчитуються плагіном із вашого вихідного коду — у кожній інтеграції, яка має хук, звідки їх можна зчитати. Angular відхиляє цей ключ повністю: його збирач закритий, тож прохід бачить лише вже мініфікований результат. CLI відхиляє цей ключ з тієї самої причини.
Далі
- Швидкий старт: оберіть стек і зберіть проєкт.
- Збірки та CI: сіди, dev проти продакшну, просування тих самих байтів.
- Конфігурація: кожен параметр і де його задати.