A fast, modern starter template for vanilla JavaScript and Sass, powered by Vite.
Includes comprehensive linting, formatting, image optimization, HTML minification, and legacy browser support.
Perfect for performant, framework-free frontend apps with strict code quality.

• ⚡️ Lightning-fast development with Vite
• 🧱 Pure Vanilla JS & Sass (no frameworks)
• 🧹 Integrated linting for HTML, CSS/SCSS, and JS
• 🖼️ Automated image optimization
• 🔧 Minified and templated HTML
• 🕸️ Legacy browser compatibility
• 🌀 Autoprefixing for cross-browser CSS

• Build: Vite
• Language: Vanilla JavaScript
• Styles: Dart Sass, modern-normalize
• Linting: ESLint, Stylelint, HTMLHint
• Formatting: Prettier
• Images: vite-plugin-imagemin
• HTML: vite-plugin-html
• PostCSS: Autoprefixer
• Legacy: @vitejs/plugin-legacy

• src/ – Source files (HTML, JS, SCSS, assets)
• dist/ – Production build output
• index.html – Entry HTML file
• vite.config.js – Vite config
• postcss.config.js – PostCSS config
• eslint.config.js, .stylelintrc, .htmlhintrc – Lint configs
• prettier.config.mjs – Formatting config
• package.json – Scripts & dependencies

• vite-plugin-html – Minifies HTML + template support
• vite-plugin-imagemin – Optimizes images
• vite-plugin-eslint2 – Lints JS
• vite-plugin-stylelint – Lints SCSS
• @vitejs/plugin-legacy – Legacy browser support

• Node.js (v18+)
• degit (npm install -g degit)

npx degit marcop135/vite-vanilla-sass-lint my-app
cd my-app
npm install
npm run dev

npm run dev       # Start dev server
npm run build     # Build for production
npm run preview   # Preview production build

Includes:

• eslint – Lint JavaScript
• stylelint – Lint CSS/SCSS
• htmlhint – Lint HTML/JSX
• prettier – Format code

npx eslint "src/assets/js/*.js"
npx stylelint "src/assets/scss/*.{scss,css}"
npx htmlhint "**/*.html"
npx prettier --check "src/**/*.{js,css,scss,html,md}"

• Vite Docs
• Sass Docs
• Modern Normalize
• Autoprefixer
• HTMLHint
• Stylelint
• ESLint
• Vite Plugins:
  • vite-plugin-html
  • vite-plugin-imagemin
  • vite-plugin-eslint2
  • vite-plugin-stylelint
  • @vitejs/plugin-legacy

Contributions welcome! Open issues or submit PRs.

Marco Pontili

Licensed under the MIT License.