本教程是為了讓你熟悉編寫(xiě)組件的過(guò)程。但在某些時(shí)候，你會(huì)想在你自己的文本編輯器里開(kāi)始編寫(xiě)組件。

首先，您需要將 Svelte 與構(gòu)建工具集成。我們推薦使用 SvelteKit，它會(huì)為你設(shè)置帶有 vite-plugin-svelte 的 Vite ...

npm create svelte@latest myapp

還有一些由社區(qū)維護(hù)的集成。

如果你是 Web 開(kāi)發(fā)的新手，以前沒(méi)有使用過(guò)這些工具，請(qǐng)不要擔(dān)心。我們已經(jīng)準(zhǔn)備了一份簡(jiǎn)單的分步指南，即針對(duì)新開(kāi)發(fā)者的 Svelte，它將引導(dǎo)你完成這一過(guò)程。

你還需要配置你的文本編輯器。有許多流行的編輯器的插件，以及官方的 VS Code 擴(kuò)展。

然后，一旦您建立了項(xiàng)目，使用 Svelte 組件就很容易了。編譯器將每個(gè)組件變成一個(gè)常規(guī)的 JavaScript 類(lèi)——只需導(dǎo)入它并用 ?new? 實(shí)例化：

import App from './App.svelte';

const app = new App({
	target: document.body,
	props: {
		// we'll learn about props later
		answer: 42
	}
});

然后，如果需要，您可以使用組件 API 與 ?app? 交互。