# SvelteKit app को obfuscate करें

@afterpack/sveltekit: vite.config.ts में sveltekit() के बाद एक plugin पंक्ति।

Source: https://www.afterpack.dev/hi/docs/frameworks/sveltekit

SvelteKit [Vite](https://www.afterpack.dev/hi/docs/frameworks/vite) से build करता है, और AfterPack **[bundler](https://www.afterpack.dev/hi/docs/frameworks)** स्तर पर integrate होता है, इसलिए `@afterpack/sveltekit` एक पतला wrapper है: `afterpackSveltekit(options)` *वही है* जो [`afterpackVite(options)`](https://www.afterpack.dev/hi/docs/frameworks/vite) है, बस Kit project में आसानी से मिल सके इसलिए यह नाम दिया गया है।

## Install

```bash
npm install -D @afterpack/sveltekit
```

```ts
// vite.config.ts
import { defineConfig } from "vite";
import { sveltekit } from "@sveltejs/kit/vite";
import { afterpackSveltekit } from "@afterpack/sveltekit";

export default defineConfig({
  plugins: [sveltekit(), afterpackSveltekit()],
});
```

इसे `sveltekit()` के **बाद** रखें। Named export `afterpackSveltekit` है; package `afterpackVite` और `AfterpackViteOptions` type को भी re-export करता है।

## Build

अब `vite build` obfuscated output देता है। `vite dev` अछूता रहता है, क्योंकि plugin केवल build के `generateBundle` पर चलता है, Vite के bundle लिखने से पहले।

आपका adapter JavaScript के रूप में जो भी emit करता है, वह obfuscate होता है। Kit, Vite को एक बार client के लिए और एक बार server के लिए चलाता है, और plugin हर bundle को बनते ही obfuscate करता है, इसलिए `adapter-static` का prerendered client bundle और Node या serverless server bundle, दोनों कवर होते हैं। `adapter-static` और `adapter-node` के साथ adapter `build/` में लिखता है; दूसरे adapters कहीं और लिखते हैं।

जब client और server output एक ही release के रूप में ship होते हैं और आप चाहते हैं कि दोनों legs एक ही seed से build हों, तो एक [`seed`](https://www.afterpack.dev/hi/docs/config#seed) pin करें। इसकी गारंटी का सबसे आसान तरीका `seed: "git"` है। Pin करना कब फ़ायदेमंद है और कब हर build पर नया seed ज़्यादा मज़बूत विकल्प है, यह [Builds & CI](https://www.afterpack.dev/hi/docs/builds) में है।

## Verify

```ts
afterpackSveltekit({ protectionMap: { enabled: true } });
```

यह संयुक्त [Protection Map](https://www.afterpack.dev/hi/docs/protection-map) को gitignored `.afterpack/protectionMap.html` में लिखता है। Source map पर इसका असर और उसे संभालने के नियम [`@afterpack/vite`](https://www.afterpack.dev/hi/docs/frameworks/vite#verify) वाले ही हैं।

*(live Protection Map demo embed — see https://www.afterpack.dev/protection-map-demo)*

`adapter-static` या `adapter-node` के साथ किसी deploy को जाँचने के लिए, upload करने से पहले `npx afterpack@latest verify build` चलाएँ। adapter protected client output को `.svelte-kit/output/client` से `build/` में copy करता है, और [`verify`](https://www.afterpack.dev/hi/docs/cli#afterpack-verify-dir) उस copy को उस output की protection receipt से जाँचता है और बदली गई हर फ़ाइल का नाम बताता है।

## Options

हर [configuration key](https://www.afterpack.dev/hi/docs/config) यहाँ options object के रूप में दी जा सकती है, जिसे ज्यों का त्यों [`@afterpack/vite`](https://www.afterpack.dev/hi/docs/frameworks/vite#options) को आगे भेज दिया जाता है। Type alias `AfterpackSveltekitOptions`, `AfterpackViteOptions` ही है।

```ts
afterpackSveltekit({ seed: "git", preset: "medium" });
```

## Directives

`.svelte` फ़ाइल के अंदर लिखा `/* @afterpack … */` marker capture नहीं होता। इसके बजाय directive को एक सादे `.ts`/`.js` module में रखें जिसे route import करता है। `src/lib/` इसकी स्वाभाविक जगह है:

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

Emit होने वाला हर chunk दोनों ही सूरतों में obfuscate होता है; सादे module की ज़रूरत केवल directive को है।

## आगे

- [Frameworks](https://www.afterpack.dev/hi/docs/frameworks): पूरी तालिका।
- [Vite](https://www.afterpack.dev/hi/docs/frameworks/vite): वह plugin जो असली काम करता है।
- [Svelte](https://www.afterpack.dev/hi/docs/frameworks/svelte): सादे (बिना Kit के) Svelte apps।
- [Protection Map](https://www.afterpack.dev/hi/docs/protection-map): report पढ़ना।
- [Builds & CI](https://www.afterpack.dev/hi/docs/builds): seeds, dev बनाम prod, वही bytes promote करना।