SvelteKit'te özel lib klasörü

SvelteKit'te yol takma adı nasıl oluşturulur

Yol takma adlarını tanımlama

Varsayılan olarak SvelteKit tarafından tanımlanan “lib” klasörünü yeniden adlandırmak veya kısa içe aktarmalar için başka bir dizin eklemek istiyorsanız, iki yapılandırmayı güncellemeniz gerekir.

  • tsconfig, böylece Typescript içe aktarma takma adınızı çözebilir
  • yol takma adlarını da bilmesi gereken svelte-config'iniz

Bu değişikliklerle, "src" içindeki her dizin yol takma adları aracılığıyla çözülebilir, bu da kısa ve basit içe aktarmalar elde etmeniz anlamına gelir.

tsconfig dosyasını güncelleme

Bu örnekte, kısa içe aktarmalar için yeni bir dizin ekleyeceğim, ancak “lib”i değiştirmek istiyorsanız aynı değişiklikler geçerli.

Aşağıdaki kod, "yollar" nesnesinin "sahte hizmet çalışanı"nın kısaltması olan yeni dizinim "msw" ile geliştirildiği güncellenmiş bir tsconfig.json'u göstermektedir. Bu klasör, MSW ile ilgili tüm kodlarımı içerir.

{
  "compilerOptions": {
    ...
    "paths": {
      "$lib": ["src/lib"],
      "$lib/*": ["src/lib/*"],
      "$msw": ["src/msw"],
      "$msw/*": ["src/msw/*"]
    }
  },
  ...
}

svelte-config'i güncelleme

Şimdi geriye kalan, "svelte.config.js" adlı SvelteKit tarafından tüketilen yapılandırmayı da güncellemek. Basitçe “vite”-nesne konfigürasyonunu güncellememiz gerekiyor. Özelleştirmemiz varsayılanı geçersiz kıldığı için "lib" klasörünü de açıkça sağlamamız gerektiğini unutmayın, bu da "lib" klasörünün artık bir takma ad olmayacağı anlamına gelir.

import adapter from "@sveltejs/adapter-auto";
import preprocess from "svelte-preprocess";
import path from "path";

/** @type {import('@sveltejs/kit').Config} */
const config = {
  // Consult https://github.com/sveltejs/svelte-preprocess
  // for more information about preprocessors
  preprocess: preprocess(),

  kit: {
    adapter: adapter(),
    vite: {
      resolve: {
        alias: {
          $msw: path.resolve("./src/msw"),
          $lib: path.resolve("./src/lib")
        }
      }
    }
  }
};

export default config;

Çözüm

Ve bu kadar! Bu küçük değişikliklerle, temiz ve basit içe aktarmalar için "src" içindeki herhangi bir klasörü yol takma adlarıyla kullanabilirsiniz.