Skip to content

Commit d9a3074

Browse files
marcop135marcop135
committed
cho: initial commit
0 parents  commit d9a3074

19 files changed

+12013
-0
lines changed

‎.browserslistrc‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
# https://browsersl.ist/
2+
3+
defaults

‎.editorconfig‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
root = true
2+
3+
[*]
4+
charset = utf-8
5+
end_of_line = lf
6+
indent_style = space
7+
indent_size = 2
8+
insert_final_newline = true
9+
trim_trailing_whitespace = true
10+
11+
[*.md]
12+
trim_trailing_whitespace = false
13+
14+
[*.{js,ts,jsx,tsx,css,scss,html,php}]
15+
indent_size = 2

‎.gitignore‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
node_modules
2+
dist
3+
.eslintcache
4+
.stylelintcache
5+
6+
# OS generated files
7+
.DS_Store
8+
Thumbs.db
9+
10+
# Log files
11+
*.log
12+
13+
.sass-cache/
14+
15+
# Local environment files
16+
*.env
17+
*.local
18+
19+
# Test coverage
20+
coverage
21+
22+
# Cypress artifacts
23+
cypress/screenshots/
24+
cypress/videos/
25+
cypress/downloads/

‎.htmlhintrc‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
{
2+
"tagname-lowercase": true,
3+
"attr-lowercase": true,
4+
"attr-value-double-quotes": true,
5+
"doctype-first": true,
6+
"tag-pair": true,
7+
"spec-char-escape": true,
8+
"id-unique": true,
9+
"src-not-empty": true,
10+
"attr-no-duplication": true,
11+
"title-require": true
12+
}

‎.nvmrc‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
22.14

‎.prettierc‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
{
2+
"semi": true,
3+
"singleQuote": true,
4+
"jsxSingleQuote": true,
5+
"tabWidth": 2,
6+
"useTabs": false,
7+
"printWidth": 80,
8+
"trailingComma": "es5",
9+
"bracketSpacing": true,
10+
"jsxBracketSameLine": false,
11+
"arrowParens": "always",
12+
"proseWrap": "preserve",
13+
"htmlWhitespaceSensitivity": "css",
14+
"endOfLine": "lf"
15+
}

‎.stylelintrc.json‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
{
2+
"extends": "stylelint-config-standard-scss",
3+
"rules": {
4+
"block-no-empty": true,
5+
"color-no-invalid-hex": true,
6+
"unit-no-unknown": true,
7+
"property-no-unknown": true,
8+
"selector-pseudo-class-no-unknown": true,
9+
"selector-pseudo-element-no-unknown": true,
10+
"no-descending-specificity": null,
11+
"value-keyword-case": null,
12+
"selector-class-pattern": null,
13+
"scss/comment-no-empty": null,
14+
"scss/double-slash-comment-empty-line-before": null,
15+
"rule-empty-line-before": null,
16+
"at-rule-empty-line-before": null,
17+
"declaration-empty-line-before": null,
18+
"media-feature-range-notation": "prefix",
19+
"no-duplicate-selectors": null
20+
}
21+
}

‎LICENSE‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
MIT License
2+
3+
Copyright (c) 2025 Marco Pontili
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in all
13+
copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21+
SOFTWARE.

‎README.md‎

Lines changed: 114 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,114 @@
1+
# 🚀 Vite Vanilla JS & Sass Supercharged Starter
2+
3+
A fast, modern template for vanilla JavaScript and Sass, powered by [Vite](https://vitejs.dev/). This setup includes comprehensive linting for HTML, CSS, and JS, uses modern-normalize for CSS resets, and demonstrates a streamlined, framework-free approach to frontend development. Enjoy optimized performance, strict code quality, and robust legacy browser support.
4+
5+
## ✨ Features
6+
7+
- ⚡️ Lightning-fast development with Vite
8+
- 🧼 Built-in linting for HTML, JavaScript, and SCSS using ESLint, Stylelint, and HTMLHint
9+
- 🖼️ Automatic image optimization
10+
- 🧱 Zero frameworks: Pure Vanilla JavaScript and Sass
11+
- 🔧 Minified, customizable HTML templates via `vite-plugin-html`
12+
- 🕸️ Legacy browser compatibility with `@vitejs/plugin-legacy`
13+
- 🌀 Automatic CSS vendor prefixing with [Autoprefixer](https://github.com/postcss/autoprefixer)
14+
15+
## 📦 Tech Stack
16+
17+
- **Build tool:** [Vite](https://vitejs.dev/)
18+
- **JavaScript:** Vanilla JS
19+
- **Preprocessor:** [Sass Embedded](https://sass-lang.com/dart-sass/)
20+
- **CSS reset:** [modern-normalize](https://github.com/sindresorhus/modern-normalize)
21+
- **Linting:** [ESLint](https://eslint.org/), [Stylelint](https://stylelint.io/), [HTMLHint](https://htmlhint.com/) — ensuring consistent, high-quality code
22+
- **Image compression:** [vite-plugin-imagemin](https://github.com/vbenjs/vite-plugin-imagemin)
23+
- **HTML minification/templates:** [vite-plugin-html](https://github.com/vbenjs/vite-plugin-html)
24+
- **PostCSS:** [Autoprefixer](https://github.com/postcss/autoprefixer)
25+
- **Legacy support:** [@vitejs/plugin-legacy](https://vitejs.dev/plugins/#vitejs/plugin-legacy)
26+
27+
## 🧪 Project Structure
28+
29+
- `src/` – Main source files (HTML, JS, SCSS, assets)
30+
- `dist/` – Production build output (generated)
31+
- `index.html` – Entry HTML file with plugin support
32+
- `vite.config.js` – Custom Vite configuration with plugins and aliases
33+
- `postcss.config.js` – PostCSS configuration (Autoprefixer, etc.)
34+
- `.eslintrc`, `.stylelintrc`, `.htmlhintrc` – Dedicated linting configurations for maximum code quality
35+
- `package.json` – Project dependencies and scripts
36+
37+
## 🧩 Vite Plugins
38+
39+
- **[vite-plugin-html](https://github.com/vbenjs/vite-plugin-html):**
40+
Compresses HTML, supports EJS-like templating, and enables multi-page apps.
41+
- **[vite-plugin-imagemin](https://github.com/vbenjs/vite-plugin-imagemin):**
42+
Optimizes images (JPEG, PNG, SVG, etc.) during build.
43+
- **[vite-plugin-eslint2](https://vite-plugin-eslint2.modyqyw.top/):**
44+
Enforces JavaScript linting during development and build with ESLint.
45+
- **[vite-plugin-stylelint](https://vite-plugin-stylelint.modyqyw.top/):**
46+
Applies Stylelint checks to SCSS/CSS for consistent, high-quality styles.
47+
- **[@vitejs/plugin-legacy](https://vitejs.dev/plugins/#vitejs/plugin-legacy):**
48+
Ensures compatibility with older browsers by generating legacy bundles.
49+
50+
---
51+
52+
## 🚀 Getting Started
53+
54+
### Requirements
55+
56+
Node.js ≥ 18.x
57+
58+
### Installation
59+
60+
```bash
61+
npm install
62+
```
63+
64+
### Development
65+
66+
```bash
67+
npm run dev
68+
# → Starts the local dev server at http://localhost:3000
69+
```
70+
71+
### Production
72+
73+
```bash
74+
npm run build
75+
# → Builds the static site into dist/
76+
77+
npm run preview
78+
# → Serves the production build locally for testing
79+
```
80+
81+
---
82+
83+
## 🧹 Linting
84+
85+
Lint your code manually using the following CLI commands:
86+
87+
- **ESLint (JavaScript):**
88+
```bash
89+
npx eslint src/
90+
```
91+
- **Stylelint (SCSS/CSS):**
92+
```bash
93+
npx stylelint "src/**/*.scss"
94+
```
95+
- **HTMLHint (HTML):**
96+
```bash
97+
npx htmlhint "src/**/*.html"
98+
```
99+
100+
You can also configure these as npm scripts in your `package.json` for convenience.
101+
102+
---
103+
104+
## 🤝 Contributing
105+
106+
Contributions are welcome! Feel free to open issues or submit pull requests to improve this template.
107+
108+
## 📝 License
109+
110+
This project is licensed under the [MIT License](LICENSE).
111+
112+
## 👤 Author
113+
114+
Created with passion by [Marco Pontili](https://marcopontili.com) - [GitHub](https://github.com/marcop135).

‎eslint.config.js‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import globals from 'globals';
2+
import { defineConfig } from 'eslint/config';
3+
4+
export default defineConfig([
5+
{
6+
files: ['**/*.{js,mjs,cjs}'],
7+
languageOptions: {
8+
ecmaVersion: 'latest',
9+
sourceType: 'module',
10+
globals: globals.browser,
11+
},
12+
rules: {
13+
semi: ['error', 'always'],
14+
'no-unused-vars': 'warn',
15+
},
16+
},
17+
]);

0 commit comments

Comments
 (0)