Introducing Templates!

Last month we’ve introduced – the fastest way to start Vite project, and the JavaScript community loved it!

Introducing: templates!

One catch with was that it would only initialize a basic JavaScript project. If you wanted to use a specific framework, you’d have to npm install all the necessary dependencies and create some boilerplate files. In contrast, when you’re running a Vite initialisation script manually, it provides a set of official templates to help developers initialize a project specifically for Vue, React, or other similar setups.

So once we’ve announced the Vite support, its creator Evan You had a brilliant idea to incorporate the templates feature into workflow as well. What he suggested was we could just append the name of the template to the URL – and we’re happy to report, this is now possible!

sb-vite new-presets

Here’s the full list of the available templates - (just add ”” before it into your URL bar!)

vanilla vanilla-ts vue vue-ts react react-ts preact preact-ts lit-element lit-element-ts svelte svelte-ts

Isn’t this cool? We are so absolutely happy this kind of workflow is now available to JavaScript developers! You can now both start quickly and have access to the underlying tooling and its configuration. It really blurs the line between what is a playground and what’s an actual app that you can start and just keep developing, right there in the browser.

Thanks to the Vite maintainers for creating this amazing tool!

Besides these official starters, the Vite community has also created an extensive list of more specific templates – you can find it in the Awesome Vite.js repository.

If you want to use one of them as the starting point to your Vite StackBlitz project, you can utilize our universal GitHub importer – just append [username]/[repo] to!

E.g. becomes

We can’t wait to see how this advancement shifts the way developers experiment, work, and play with code!

🤫 Psst! In truth, we’re already aware of how these specific features are being used by some of the JavaScript open-source makers to help with their work, but we’ll leave that for one of the following posts :)

Tomek Sułkowski
Founding Engineer & DevRel at StackBlitz. Let's talk about docs, live examples, teaching, and experimenting in browsers!
Explore more from StackBlitz

Subscribe to StackBlitz Updates

A newsletter from StackBlitz covering engineering achievements, product features, and updates from the community.

Using StackBlitz at work?

Create in-browser preview apps for every issue or pull request, share private templates with your org, manage your design system with zero overhead, and more.

Try StackBlitz Teams