पथ उपनामों को परिभाषित करना
यदि आप डिफ़ॉल्ट रूप से SvelteKit द्वारा परिभाषित "lib" -फ़ोल्डर का नाम बदलना चाहते हैं या लघु आयात के लिए कोई अन्य निर्देशिका जोड़ना चाहते हैं, तो आपको दो कॉन्फ़िगरेशन अपडेट करने होंगे।
- tsconfig, ताकि टाइपप्रति आपके आयात उपनाम को हल कर सके
- आपका svelte-config, जिसे पथ उपनाम भी जानना है
इन परिवर्तनों के साथ, "src" में प्रत्येक निर्देशिका को पथ उपनामों के माध्यम से हल किया जा सकता है, जिसका अर्थ है कि आपको छोटे और सरल आयात मिलते हैं।
Tsconfig-file को अपडेट कर रहा है
इस उदाहरण में, मैं लघु आयात के लिए एक नई निर्देशिका जोड़ूंगा, लेकिन यदि आप "lib" को बदलना चाहते हैं तो वही परिवर्तन लागू होते हैं।
निम्न कोड एक अद्यतन tsconfig.json दिखाता है, जहां "पथ" -ऑब्जेक्ट को मेरी नई निर्देशिका "एमएसडब्ल्यू" के साथ बढ़ाया गया है, जो "नकली सेवा कार्यकर्ता" का संक्षेप है। इस फ़ोल्डर में मेरे सभी MSW संबंधित कोड हैं।
{
"compilerOptions": {
...
"paths": {
"$lib": ["src/lib"],
"$lib/*": ["src/lib/*"],
"$msw": ["src/msw"],
"$msw/*": ["src/msw/*"]
}
},
...
}
svelte-config को अपडेट कर रहा है
अब जो कुछ बचा है, वह "svelte.config.js" नाम के SvelteKit द्वारा उपभोग किए गए कॉन्फ़िगरेशन को भी अपडेट करना है। हमें बस "vite" -ऑब्जेक्ट कॉन्फ़िगरेशन को अपडेट करना है। ध्यान दें कि हमें स्पष्ट रूप से "lib" -फ़ोल्डर भी प्रदान करना होगा, क्योंकि हमारा अनुकूलन डिफ़ॉल्ट को ओवरराइड करता है, जिसका अर्थ है कि "lib" -फ़ोल्डर अब कोई उपनाम नहीं होगा।
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;
निष्कर्ष
और बस! इन छोटे परिवर्तनों के साथ, आप स्वच्छ और सरल आयात के लिए पथ उपनामों के साथ "src" में किसी भी फ़ोल्डर का उपयोग कर सकते हैं।
