Getting Started
Vilo
Advanced tooling for the modern web. Built for speed,
Overview
Vilo is a modern, Vite-powered command-line tool designed to simplify project creation and customization for frontend developers. By harnessing Vite’s fast build times and modular architecture, Vilo provides an optimized development experience while supporting an extensive array of project templates.
Key Features
Powered by Vite: Built on top of Vite, Vilo inherits Vite’s blazing-fast performance and compatibility with modern frameworks, enabling efficient project builds and smooth hot-reloading.
Customizable Project Templates: Developers can use Vilo’s default templates or request to add their own, allowing for a highly adaptable setup tailored to various project types.
Interactive Setup Process: Vilo offers an easy-to-navigate, interactive setup experience, similar to Vite’s, with options for language choice and project structure.
Flexibility and Extensibility: Vilo supports JavaScript and TypeScript and is compatible with many frontend tools, making it a versatile solution for a wide range of projects.
| JavaScript | TypeScript |
|---|---|
| Olova | olova ❌ |
| vue | vue-ts |
| react | react-ts |
| preact | preact-ts |
| lit | lit-ts |
| svelte | svelte-ts |
| solid | solid-ts |
| qwik | qwik-ts |
| vanilla | vanilla-ts |
Join our Discord to showcase your custom template here!
Launching Your First Vilo Project
Compatibility Note
Vite requires Node.js version 18+ or 20+. However, some templates require a higher Node.js version to work, please upgrade if your package manager warns about it.
npm create vilo@latestnpx vilo@latestpnpm create vilo@latestyarn create vilo@latest
# coming soon...bun create vilo@latest
# coming soon...deno create vilo@latest
# coming soon...Next, follow the prompts!
You can also directly set the project name and the desired template using additional command line options. For instance, to create a project using vilo and olova, execute the following command:
# npm 7+, extra double-dash is needed:
npm create vilo@latest my-vilo-project -- --template olovanpx vilo@latest my-vilo-project --template olovapnpm create vilo@latest my-vilo-project --template olovayarn create vilo@latest my-vilo-project --template olova
# coming soon...bun create vilo@latest my-vilo-project --template olova
# coming soon...deno create vilo@latest my-vilo-project --template olova
# coming soon...You can also use a tool like degit created by Rich-Harris to scaffold your project with one of the templates. Assuming the project is on GitHub and uses main as the default branch, you can create a local copy using:
npx degit user/project#main my-project
cd my-project
npm install
npm run devTIP
For manual installation, you can refer to the Vite documentation for more details: Vite Guide