Вопрос или проблема
У меня есть два проекта:
- Создан с помощью
npm create vite app-with-svelte -- -t svelte-ts - Создан с помощью
npm create svelte app-with-sveltekit(скелетный проект)
Затем я использую статический адаптер, следуя этой документации. В итоге, svelte.config.js:
import adapter from "@sveltejs/adapter-static";
import { vitePreprocess } from "@sveltejs/vite-plugin-svelte";
const config = {
preprocess: vitePreprocess(),
kit: {
adapter: adapter({
pages: "build",
assets: "build",
fallback: undefined,
precompress: false,
strict: true,
}),
},
};
export default config;
src/routes/+layout.ts:
export const prerender = true;
Оба проекта предназначены для размещения как статические файлы. Есть ли один из них лучше другого?
Я создал проект с использованием статического адаптера SvelteKit с Neutralino. На середине пути я застрял из-за Совместимости с SvelteKit (проблема Neutralino), что заставило меня использовать Svelte. Поэтому я искал способ миграции с SvelteKit на Svelte и нашел твит в reddit:
Не нужно мигрировать с kit. Посмотрите на
@sveltejs/adapter-static. Это должно решить вашу проблему
После npm run build, являются ли Svelte и статический адаптер SvelteKit одинаковыми? Если да, то какой из них мне использовать?
Они не одинаковы. Самое важное, что стоит отметить, это то, что Sveltekit может маршрутизировать страницы, в то время как проект Vite + Svelte не имеет возможностей маршрутизации, потому что у Svelte нет встроенного маршрутизатора.
Ответ или решение
Svelte и SvelteKit с адаптером для статической сборки не являются одним и тем же. Давайте подробно рассмотрим различия и преимущества каждого подхода, а также решим ваши вопросы по поводу использования.
Основные различия
-
Routing (Маршрутизация):
- Svelte: Базовая версия Svelte, созданная с помощью Vite, не включает встроенную систему маршрутизации. Это означает, что вам необходимо реализовать свою собственную маршрутизацию, если вы хотите создавать многостраничные приложения.
- SvelteKit: SvelteKit включает в себя мощную и гибкую систему маршрутизации "из коробки". Это позволяет вам легко определять маршруты и организовывать структуру вашего приложения, что значительно упрощает разработку многостраничных приложений.
-
Функции и возможности:
- Svelte: Это библиотека для создания пользовательских интерфейсов, и она сама по себе не предоставляет множество функций, таких как серверный рендеринг или поддержка API.
- SvelteKit: Это фреймворк на базе Svelte, который предоставляет дополнительные функции, такие как серверный рендеринг, динамическая маршрутизация и адаптеры для различных платформ (включая статическую сборку).
Преимущества SvelteKit с адаптером для статической сборки
-
Удобство использования: SvelteKit значительно упрощает процесс разработки благодаря своему подходу к маршрутизации и организации файловой структуры.
-
Гибкость: Благодаря адаптерам, SvelteKit может быть легко развернут на различных платформах, включая статические хостинги.
-
Оптимизация: SvelteKit автоматически обрабатывает оптимизацию вашего приложения, что позволяет добиться лучшей производительности.
-
Пререндеринг: Вы можете использовать механизмы пререндеринга в SvelteKit, что дает вам возможность генерировать статические страницы во время сборки.
Рекомендации по выбору
Если вы разрабатываете приложение, которое требует многостраничной поддержки с маршрутизацией, а также хотите использовать удобства, предлагаемые SvelteKit, значит, вам стоит использовать SvelteKit с адаптером для статической сборки.
Если же ваша цель — создание небольших, простых приложений без сложной маршрутизации, то использование простого Svelte может быть оправданным выбором.
Заключение
В итоге, Svelte и SvelteKit с адаптером для статической сборки — это разные инструменты, каждый из которых имеет свои особенности. Ваш выбор должен основываться на потребностях вашего проекта: для более сложных и многофункциональных приложений рекомендуется SvelteKit, в то время как для простых интерфейсов и одноразовых страниц можно рассмотреть использование только Svelte.