Skip to content
Get packs

Guide · Open source

How to use Svelte: install, write components and build apps

Updated · written with AI from the project's own documentation and checked against our catalogue data

Svelte is an open-source web development project from sveltejs. It works as a compiler: you write declarative components, and Svelte converts them ahead of time into efficient JavaScript that updates the page's DOM directly. This guide shows how to install the svelte package, what Svelte is good for, and when another tool may fit better, so you can decide whether to start a project with it.

Sveltesveltejs/svelte · ★ 88.5k · MIT

Quick start

  1. 1Install Node.js. Svelte lists Node.js as its prerequisite. Install Node.js before you continue.
  2. 2Install the svelte package. In your project folder, run npm install svelte to add the package from npm.
  3. 3Read the official guide. Open svelte.dev to learn how to write components and the language.
  4. 4Build a small component. Write a declarative component to see how Svelte compiles it into JavaScript.
  5. 5Ask questions or follow updates. Join the Discord chatroom linked in the README or check the public roadmap.

What Svelte is and who it is for

Svelte describes itself as a new way to build web applications. Instead of shipping a runtime that interprets your components in the browser, it compiles your declarative components into JavaScript that surgically updates the DOM. The stated aim is to make web interfaces simpler to write while keeping the output lightweight.

The project lists three groups it is best suited for: developers who want to build interactive websites with less boilerplate, teams building web apps who prefer a compiler-based approach, and learners who want to understand how modern component frameworks work.

  • Good fit: interactive websites and web apps where you want less boilerplate.
  • Good fit: learning how component frameworks work under the hood.
  • Not a fit: no-code tools, because Svelte requires writing code.

Install Svelte with npm (requires Node.js)

Svelte is installed as a package. The README points to the svelte package on npm, and the install method is a package manager. The listed prerequisite is Node.js, so install Node.js first, then run the install command in your project folder.

  • Prerequisite: Node.js.
  • Install the svelte package from npm.
npm install svelte

Learn the core idea: components that compile

A Svelte component is written in a declarative style. Svelte's compiler converts it ahead of time into JavaScript, so the work of updating the page happens in that compiled output rather than in a large runtime library. The README describes this as updating the DOM surgically, meaning only the parts that change are touched.

Read the Svelte website at svelte.dev for the official guide to components and the language. The README also links to a Discord chatroom and a public roadmap if you want to follow what the team is working on.

Get help, follow the roadmap and contribute

For questions, the README links to the Svelte Discord chatroom. The project roadmap is published on the Svelte site, so you can see current work. If you want to contribute code, read the Contributing Guide in the repository and the svelte package folder it references.

Svelte is MIT-licensed and maintained by volunteers. The README notes that donations through Open Collective pay for costs such as hosting and may support development more directly.

  • Chat: svelte.dev/chat
  • Roadmap: svelte.dev/roadmap
  • Contributing: see CONTRIBUTING.md and the packages/svelte folder.

Troubleshoot when svelte.dev will not load

The README says that if svelte.dev seems to be down, it is probably not, but a .dev site outage is possible. If you cannot reach any .dev sites, the README links to a SuperUser question and answer about the problem, which is a network or DNS issue rather than a Svelte issue.

What people use it for

  • Building interactive websites that need less boilerplate code.
  • Building web apps where a compiler-based approach is preferred by the team.
  • Learning how modern component frameworks turn declarative code into page updates.
  • Contributing to an open-source web framework under the MIT licence.

Frequently asked questions

Is Svelte free to use?

Yes. Svelte is MIT-licensed, and the README names the MIT licence in its License section. Donations through Open Collective are optional and are used for project expenses such as hosting.

How do I install Svelte?

Install Node.js first, then run npm install svelte in your project folder. The package is published on npm.

What do I need to run Svelte?

The README lists Node.js as the prerequisite. Svelte is installed through a package manager.

Is Svelte better than React or Vue?

The README does not compare Svelte with other frameworks, so this guide cannot rank them. Svelte's stated approach is a compiler that outputs efficient JavaScript. Comparable projects include React, Vue and Solid, so you can test each one on a small component to judge fit.

Can I use Svelte without writing code?

No. The README says Svelte requires writing code, so it is not a no-code tool.

Why is svelte.dev not loading?

The README says the site is probably up, but .dev sites can go down. If no .dev site loads, the README links to a SuperUser question about the issue.

New agent skills, repos and AI tools — every week

The best new skills and open-source projects, the fastest-growing repos, and one free prompt. Five minutes to read. Unsubscribe anytime.

Our verdict

Svelte suits developers and teams who want interactive web interfaces with less boilerplate and a compiler-based approach, and learners curious about how components work. Skip it if you need a no-code tool or if you require long-established tooling, since the README gives little detail on ecosystem maturity for this use.

Install options & downloads