AfterPack
Переглянути як Markdown

Обфускація застосунку Svelte

@afterpack/svelte обгортає @afterpack/vite для проєктів Svelte: один рядок плагіна у vite.config.ts.

Застосунки Svelte компілюються в JavaScript через Vite, а AfterPack інтегрується на рівні бандлера, тож @afterpack/svelte є тонкою обгорткою: afterpackSvelte(options) — це і є afterpackVite(options), лише з назвою, яку легко знайти в проєкті Svelte.

Збираєте повноцінний застосунок SvelteKit? Використовуйте @afterpack/sveltekit. Збираєте бібліотеку компонентів Svelte через Rollup? Використовуйте @afterpack/rollup.

Встановлення

$ npm install -D @afterpack/svelte
// vite.config.ts
import { defineConfig } from "vite";
import { svelte } from "@sveltejs/vite-plugin-svelte";
import { afterpackSvelte } from "@afterpack/svelte";

export default defineConfig({
  plugins: [svelte(), afterpackSvelte()],
});

Розмістіть його після svelte(). Іменований експорт — afterpackSvelte; пакет також реекспортує afterpackVite і тип AfterpackViteOptions.

Збірка

Тепер vite build видає обфускований результат. vite dev не зачіпається, бо плагін працює лише на етапі generateBundle збірки, до того як Vite запише бандл.

Перевірка

afterpackSvelte({ protectionMap: { enabled: true } });

Записує об'єднану Protection Map у внесений до gitignore .afterpack/protectionMap.html. Побічний ефект для source map і правила поводження з ним ті самі, що й у @afterpack/vite.

entitlements.jslight · complexity 5Open full size
entitlements.js, 54 lines, built at the light preset with a directive around the signature check. Click any token to see what was applied to it.

Параметри

Будь-який ключ конфігурації можна передати тут в об'єкті параметрів; він без змін передається в @afterpack/vite. Псевдонім типу AfterpackSvelteOptions дорівнює AfterpackViteOptions.

afterpackSvelte({ seed: "git", preset: "medium" });

Директиви

Маркер /* @afterpack … */ усередині файлу .svelte не зчитується. Натомість розмістіть директиви у звичайному модулі .ts/.js, який імпортує компонент:

// src/lib/license.ts
/* @afterpack preset=hard */
export function verify(token: string) {
  // ...
}
/* @afterpack end */

Кожен виданий чанк обфускується в будь-якому разі; звичайний модуль потрібен лише для директиви.

Далі