├── demo ├── vitesse │ ├── .dockerignore │ ├── .github │ │ ├── FUNDING.yml │ │ └── workflows │ │ │ └── ci.yml │ ├── .npmrc │ ├── .eslintrc │ ├── public │ │ ├── _headers │ │ ├── pwa-192x192.png │ │ ├── pwa-512x512.png │ │ ├── favicon.svg │ │ ├── favicon-dark.svg │ │ └── safari-pinned-tab.svg │ ├── src │ │ ├── types.ts │ │ ├── composables │ │ │ └── dark.ts │ │ ├── pages │ │ │ ├── [...all].vue │ │ │ ├── README.md │ │ │ ├── about.md │ │ │ ├── hi │ │ │ │ └── [name].vue │ │ │ └── index.vue │ │ ├── layouts │ │ │ ├── home.vue │ │ │ ├── default.vue │ │ │ ├── 404.vue │ │ │ └── README.md │ │ ├── modules │ │ │ ├── README.md │ │ │ ├── nprogress.ts │ │ │ ├── pwa.ts │ │ │ ├── pinia.ts │ │ │ └── i18n.ts │ │ ├── components │ │ │ ├── TheCounter.vue │ │ │ ├── README.md │ │ │ ├── TheInput.vue │ │ │ └── TheFooter.vue │ │ ├── styles │ │ │ ├── main.css │ │ │ └── markdown.css │ │ ├── shims.d.ts │ │ ├── components.d.ts │ │ ├── App.vue │ │ ├── main.ts │ │ └── stores │ │ │ └── user.ts │ ├── .gitignore │ ├── test │ │ ├── basic.test.ts │ │ ├── __snapshots__ │ │ │ └── component.test.ts.snap │ │ └── component.test.ts │ ├── .editorconfig │ ├── cypress │ │ ├── tsconfig.json │ │ └── e2e │ │ │ └── basic.spec.ts │ ├── locales │ │ ├── ko.yml │ │ ├── zh-CN.yml │ │ ├── ja.yml │ │ ├── ar.yml │ │ ├── it.yml │ │ ├── en.yml │ │ ├── ru.yml │ │ ├── uk.yml │ │ ├── id.yml │ │ ├── vi.yml │ │ ├── de.yml │ │ ├── ka.yml │ │ ├── tr.yml │ │ ├── pl.yml │ │ ├── README.md │ │ ├── es.yml │ │ ├── pt-BR.yml │ │ ├── uz.yml │ │ └── fr.yml │ ├── .vscode │ │ ├── extensions.json │ │ └── settings.json │ ├── netlify.toml │ ├── cypress.config.ts │ ├── Dockerfile │ ├── index.html │ ├── tsconfig.json │ ├── uno.config.ts │ ├── LICENSE │ ├── package.json │ ├── vite.config.ts │ ├── README.zh-CN.md │ └── README.md └── react │ ├── src │ ├── vite-env.d.ts │ ├── App.tsx │ ├── main.tsx │ └── index.css │ ├── .gitignore │ ├── README.md │ ├── .editorconfig │ ├── vite.config.ts │ ├── index.html │ ├── vite.second.config.ts │ ├── package.json │ ├── tsconfig.json │ ├── LICENSE │ ├── stats.yml │ ├── stats.json │ └── pnpm-lock.yaml ├── .gitignore ├── screenshots ├── network.jpg ├── treemap.png └── sunburst.png ├── .release-it.json ├── .editorconfig ├── index.d.ts ├── fixtures ├── vite3 │ ├── counter.js │ ├── package.json │ ├── .gitignore │ ├── index.html │ ├── main.js │ ├── javascript.svg │ ├── public │ │ └── vite.svg │ ├── style.css │ └── pnpm-lock.yaml ├── vite4 │ ├── counter.js │ ├── package.json │ ├── .gitignore │ ├── index.html │ ├── main.js │ ├── javascript.svg │ ├── public │ │ └── vite.svg │ ├── style.css │ └── pnpm-lock.yaml └── yarn-pnp │ ├── counter.js │ ├── package.json │ ├── index.html │ ├── .gitignore │ ├── main.js │ ├── javascript.svg │ ├── public │ └── vite.svg │ └── style.css ├── tsconfig.json ├── .github └── workflows │ └── ci.yml ├── LICENSE ├── package.json ├── bin.js ├── index.js └── README.md /demo/vitesse/.dockerignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | dist 3 | -------------------------------------------------------------------------------- /demo/vitesse/.github/FUNDING.yml: -------------------------------------------------------------------------------- 1 | github: antfu 2 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | dist 3 | .DS_Store 4 | stats.html 5 | -------------------------------------------------------------------------------- /demo/react/src/vite-env.d.ts: -------------------------------------------------------------------------------- 1 | /// 2 | -------------------------------------------------------------------------------- /demo/vitesse/.npmrc: -------------------------------------------------------------------------------- 1 | shamefully-hoist=true 2 | strict-peer-dependencies=false 3 | -------------------------------------------------------------------------------- /demo/react/.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | .DS_Store 3 | dist 4 | dist-ssr 5 | *.local 6 | -------------------------------------------------------------------------------- /demo/vitesse/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": [ 3 | "@antfu", 4 | "@unocss" 5 | ] 6 | } 7 | -------------------------------------------------------------------------------- /demo/vitesse/public/_headers: -------------------------------------------------------------------------------- 1 | /assets/* 2 | cache-control: max-age=31536000 3 | cache-control: immutable 4 | -------------------------------------------------------------------------------- /screenshots/network.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KusStar/vite-bundle-visualizer/HEAD/screenshots/network.jpg -------------------------------------------------------------------------------- /screenshots/treemap.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KusStar/vite-bundle-visualizer/HEAD/screenshots/treemap.png -------------------------------------------------------------------------------- /screenshots/sunburst.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KusStar/vite-bundle-visualizer/HEAD/screenshots/sunburst.png -------------------------------------------------------------------------------- /demo/vitesse/public/pwa-192x192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KusStar/vite-bundle-visualizer/HEAD/demo/vitesse/public/pwa-192x192.png -------------------------------------------------------------------------------- /demo/vitesse/public/pwa-512x512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/KusStar/vite-bundle-visualizer/HEAD/demo/vitesse/public/pwa-512x512.png -------------------------------------------------------------------------------- /demo/vitesse/src/types.ts: -------------------------------------------------------------------------------- 1 | import { type ViteSSGContext } from 'vite-ssg' 2 | 3 | export type UserModule = (ctx: ViteSSGContext) => void 4 | -------------------------------------------------------------------------------- /demo/react/README.md: -------------------------------------------------------------------------------- 1 | # demo 2 | 3 | > Generated by [KusStar/gkd](https://github.com/KusStar/gkd). 4 | 5 | ## License 6 | 7 | [MIT](LICENSE) 8 | -------------------------------------------------------------------------------- /.release-it.json: -------------------------------------------------------------------------------- 1 | { 2 | "git": { 3 | "commitMessage": "chore: release v${version}" 4 | }, 5 | "github": { 6 | "release": true 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /demo/vitesse/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | .vite-ssg-dist 3 | .vite-ssg-temp 4 | *.local 5 | dist 6 | dist-ssr 7 | node_modules 8 | .idea/ 9 | *.log 10 | cypress/downloads 11 | -------------------------------------------------------------------------------- /demo/vitesse/test/basic.test.ts: -------------------------------------------------------------------------------- 1 | import { describe, expect, it } from 'vitest' 2 | 3 | describe('tests', () => { 4 | it('should works', () => { 5 | expect(1 + 1).toEqual(2) 6 | }) 7 | }) 8 | -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | root = true 2 | 3 | [*] 4 | indent_style = space 5 | indent_size = 2 6 | end_of_line = lf 7 | charset = utf-8 8 | trim_trailing_whitespace = true 9 | insert_final_newline = true 10 | 11 | -------------------------------------------------------------------------------- /demo/react/.editorconfig: -------------------------------------------------------------------------------- 1 | root = true 2 | 3 | [*] 4 | indent_style = space 5 | indent_size = 2 6 | end_of_line = lf 7 | charset = utf-8 8 | trim_trailing_whitespace = true 9 | insert_final_newline = true 10 | 11 | -------------------------------------------------------------------------------- /demo/react/src/App.tsx: -------------------------------------------------------------------------------- 1 | import { FC } from 'react'; 2 | 3 | interface Props {} 4 | 5 | const App: FC = () => { 6 | return ( 7 |

Hello, demo

8 | ) 9 | } 10 | 11 | export default App; 12 | -------------------------------------------------------------------------------- /demo/vitesse/.editorconfig: -------------------------------------------------------------------------------- 1 | root = true 2 | 3 | [*] 4 | charset = utf-8 5 | indent_style = space 6 | indent_size = 2 7 | end_of_line = lf 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | -------------------------------------------------------------------------------- /demo/vitesse/src/composables/dark.ts: -------------------------------------------------------------------------------- 1 | // these APIs are auto-imported from @vueuse/core 2 | export const isDark = useDark() 3 | export const toggleDark = useToggle(isDark) 4 | export const preferredDark = usePreferredDark() 5 | -------------------------------------------------------------------------------- /demo/vitesse/cypress/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "types": [ 5 | "cypress" 6 | ] 7 | }, 8 | "exclude": [], 9 | "include": [ 10 | "**/*.ts" 11 | ] 12 | } 13 | -------------------------------------------------------------------------------- /demo/vitesse/test/__snapshots__/component.test.ts.snap: -------------------------------------------------------------------------------- 1 | // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html 2 | 3 | exports[`TheCounter.vue > should render 1`] = `"
10
"`; 4 | -------------------------------------------------------------------------------- /demo/react/src/main.tsx: -------------------------------------------------------------------------------- 1 | import ReactDOM from 'react-dom/client' 2 | import './index.css' 3 | import App from './App' 4 | 5 | const container = document.getElementById('root') 6 | 7 | const root = ReactDOM.createRoot(container) 8 | 9 | root.render() 10 | 11 | -------------------------------------------------------------------------------- /demo/vitesse/src/pages/[...all].vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | 10 | 11 | 12 | meta: 13 | layout: 404 14 | 15 | -------------------------------------------------------------------------------- /index.d.ts: -------------------------------------------------------------------------------- 1 | type Options = { 2 | help?: boolean, 3 | template?: 'treemap' | 'sunburst' | 'network', 4 | output?: string, 5 | open?: boolean, 6 | config?: string, 7 | } 8 | 9 | declare const start: (options: Options) => Promise 10 | 11 | export default start; 12 | -------------------------------------------------------------------------------- /demo/vitesse/locales/ko.yml: -------------------------------------------------------------------------------- 1 | button: 2 | about: 소개 3 | back: 뒤로가기 4 | go: 이동 5 | home: 홈 6 | toggle_dark: 다크모드 토글 7 | toggle_langs: 언어 변경 8 | intro: 9 | desc: Vite 애플리케이션 템플릿 10 | dynamic-route: 다이나믹 라우트 데모 11 | hi: 안녕, {name}! 12 | whats-your-name: 이름이 뭐예요? 13 | not-found: 찾을 수 없습니다 14 | -------------------------------------------------------------------------------- /demo/vitesse/src/layouts/home.vue: -------------------------------------------------------------------------------- 1 | 13 | -------------------------------------------------------------------------------- /fixtures/vite3/counter.js: -------------------------------------------------------------------------------- 1 | export function setupCounter(element) { 2 | let counter = 0 3 | const setCounter = (count) => { 4 | counter = count 5 | element.innerHTML = `count is ${counter}` 6 | } 7 | element.addEventListener('click', () => setCounter(counter + 1)) 8 | setCounter(0) 9 | } 10 | -------------------------------------------------------------------------------- /fixtures/vite4/counter.js: -------------------------------------------------------------------------------- 1 | export function setupCounter(element) { 2 | let counter = 0 3 | const setCounter = (count) => { 4 | counter = count 5 | element.innerHTML = `count is ${counter}` 6 | } 7 | element.addEventListener('click', () => setCounter(counter + 1)) 8 | setCounter(0) 9 | } 10 | -------------------------------------------------------------------------------- /demo/vitesse/locales/zh-CN.yml: -------------------------------------------------------------------------------- 1 | button: 2 | about: 关于 3 | back: 返回 4 | go: 确定 5 | home: 首页 6 | toggle_dark: 切换深色模式 7 | toggle_langs: 切换语言 8 | intro: 9 | desc: 固执己见的 Vite 项目模板 10 | dynamic-route: 动态路由演示 11 | hi: 你好，{name} 12 | aka: 也叫 13 | whats-your-name: 输入你的名字 14 | not-found: 未找到页面 15 | -------------------------------------------------------------------------------- /demo/vitesse/src/layouts/default.vue: -------------------------------------------------------------------------------- 1 | 13 | -------------------------------------------------------------------------------- /fixtures/yarn-pnp/counter.js: -------------------------------------------------------------------------------- 1 | export function setupCounter(element) { 2 | let counter = 0 3 | const setCounter = (count) => { 4 | counter = count 5 | element.innerHTML = `count is ${counter}` 6 | } 7 | element.addEventListener('click', () => setCounter(counter + 1)) 8 | setCounter(0) 9 | } 10 | -------------------------------------------------------------------------------- /demo/vitesse/locales/ja.yml: -------------------------------------------------------------------------------- 1 | button: 2 | about: これは？ 3 | back: 戻る 4 | go: 進む 5 | home: ホーム 6 | toggle_dark: ダークモード切り替え 7 | toggle_langs: 言語切り替え 8 | intro: 9 | desc: 固執された Vite スターターテンプレート 10 | dynamic-route: 動的ルートのデモ 11 | hi: こんにちは、{name}! 12 | whats-your-name: 君の名は。 13 | not-found: 見つかりませんでした 14 | -------------------------------------------------------------------------------- /demo/vitesse/public/favicon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /demo/vitesse/.vscode/extensions.json: -------------------------------------------------------------------------------- 1 | { 2 | "recommendations": [ 3 | "antfu.iconify", 4 | "antfu.unocss", 5 | "antfu.vite", 6 | "antfu.goto-alias", 7 | "csstools.postcss", 8 | "dbaeumer.vscode-eslint", 9 | "vue.volar", 10 | "lokalise.i18n-ally", 11 | "streetsidesoftware.code-spell-checker" 12 | ] 13 | } 14 | -------------------------------------------------------------------------------- /demo/vitesse/src/modules/README.md: -------------------------------------------------------------------------------- 1 | ## Modules 2 | 3 | A custom user module system. Place a `.ts` file with the following template, it will be installed automatically. 4 | 5 | ```ts 6 | import { type UserModule } from '~/types' 7 | 8 | export const install: UserModule = ({ app, router, isClient }) => { 9 | // do something 10 | } 11 | ``` 12 | -------------------------------------------------------------------------------- /demo/vitesse/public/favicon-dark.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /fixtures/vite3/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "vite3", 3 | "private": true, 4 | "version": "0.0.0", 5 | "type": "module", 6 | "scripts": { 7 | "dev": "vite", 8 | "build": "vite build", 9 | "preview": "vite preview" 10 | }, 11 | "devDependencies": { 12 | "vite": "^3.2.3", 13 | "vite-bundle-visualizer": "link:../.." 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /fixtures/vite4/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "vite4", 3 | "private": true, 4 | "version": "0.0.0", 5 | "type": "module", 6 | "scripts": { 7 | "dev": "vite", 8 | "build": "vite build", 9 | "preview": "vite preview" 10 | }, 11 | "devDependencies": { 12 | "vite": "^4.4.5", 13 | "vite-bundle-visualizer": "link:../.." 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /demo/react/vite.config.ts: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'vite' 2 | import react from '@vitejs/plugin-react' 3 | import path from 'path' 4 | 5 | 6 | // https://vitejs.dev/config/ 7 | export default defineConfig({ 8 | plugins: [ 9 | react() 10 | ], 11 | resolve: { 12 | alias: { 13 | '@': path.resolve(__dirname, 'src') 14 | } 15 | } 16 | }) 17 | -------------------------------------------------------------------------------- /demo/vitesse/netlify.toml: -------------------------------------------------------------------------------- 1 | [build.environment] 2 | NODE_VERSION = "16" 3 | 4 | [build] 5 | publish = "dist" 6 | command = "pnpm run build" 7 | 8 | [[redirects]] 9 | from = "/*" 10 | to = "/index.html" 11 | status = 200 12 | 13 | [[headers]] 14 | for = "/manifest.webmanifest" 15 | [headers.values] 16 | Content-Type = "application/manifest+json" 17 | -------------------------------------------------------------------------------- /demo/vitesse/locales/ar.yml: -------------------------------------------------------------------------------- 1 | button: 2 | about: حول 3 | back: رجوع 4 | go: تجربة 5 | home: الرئيسية 6 | toggle_dark: التغيير إلى الوضع المظلم 7 | toggle_langs: تغيير اللغة 8 | intro: 9 | desc: vite مثال لتطبيق 10 | dynamic-route: عرض لتوجيهات ديناميكية 11 | hi: مرحبا {name} 12 | aka: معروف أيضا تحت مسمى 13 | whats-your-name: ما إسمك؟ 14 | not-found: صفحة غير موجودة 15 | -------------------------------------------------------------------------------- /demo/vitesse/locales/it.yml: -------------------------------------------------------------------------------- 1 | button: 2 | about: Su di me 3 | back: Indietro 4 | go: Vai 5 | home: Home 6 | toggle_dark: Attiva/disattiva modalità scura 7 | toggle_langs: Cambia lingua 8 | intro: 9 | desc: Modello per una Applicazione Vite 10 | dynamic-route: Demo di rotta dinamica 11 | hi: Ciao, {name}! 12 | whats-your-name: Come ti chiami? 13 | not-found: Non trovato 14 | -------------------------------------------------------------------------------- /fixtures/vite3/.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | pnpm-debug.log* 8 | lerna-debug.log* 9 | 10 | node_modules 11 | dist 12 | dist-ssr 13 | *.local 14 | 15 | # Editor directories and files 16 | .vscode/* 17 | !.vscode/extensions.json 18 | .idea 19 | .DS_Store 20 | *.suo 21 | *.ntvs* 22 | *.njsproj 23 | *.sln 24 | *.sw? 25 | -------------------------------------------------------------------------------- /fixtures/vite4/.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | pnpm-debug.log* 8 | lerna-debug.log* 9 | 10 | node_modules 11 | dist 12 | dist-ssr 13 | *.local 14 | 15 | # Editor directories and files 16 | .vscode/* 17 | !.vscode/extensions.json 18 | .idea 19 | .DS_Store 20 | *.suo 21 | *.ntvs* 22 | *.njsproj 23 | *.sln 24 | *.sw? 25 | -------------------------------------------------------------------------------- /demo/vitesse/locales/en.yml: -------------------------------------------------------------------------------- 1 | button: 2 | about: About 3 | back: Back 4 | go: GO 5 | home: Home 6 | toggle_dark: Toggle dark mode 7 | toggle_langs: Change languages 8 | intro: 9 | desc: Opinionated Vite Starter Template 10 | dynamic-route: Demo of dynamic route 11 | hi: Hi, {name}! 12 | aka: Also known as 13 | whats-your-name: What's your name? 14 | not-found: Not found 15 | -------------------------------------------------------------------------------- /demo/vitesse/locales/ru.yml: -------------------------------------------------------------------------------- 1 | button: 2 | about: О шаблоне 3 | back: Назад 4 | go: Перейти 5 | home: Главная 6 | toggle_dark: Включить темный режим 7 | toggle_langs: Сменить язык 8 | intro: 9 | desc: Самостоятельный начальный шаблон Vite 10 | dynamic-route: Демо динамического маршрута 11 | hi: Привет, {name}! 12 | whats-your-name: Как тебя зовут? 13 | not-found: Не найден 14 | -------------------------------------------------------------------------------- /demo/vitesse/locales/uk.yml: -------------------------------------------------------------------------------- 1 | button: 2 | about: Про шаблон 3 | back: Назад 4 | go: Перейти 5 | home: Головна 6 | toggle_dark: Переключити темний режим 7 | toggle_langs: Змінити мову 8 | intro: 9 | desc: Самостійний початковий шаблон Vite 10 | dynamic-route: Демо динамічного маршруту 11 | hi: Привіт, {name}! 12 | whats-your-name: Як тебе звати? 13 | not-found: Не знайдено 14 | -------------------------------------------------------------------------------- /demo/vitesse/locales/id.yml: -------------------------------------------------------------------------------- 1 | button: 2 | about: Tentang 3 | back: Kembali 4 | go: Pergi 5 | home: Beranda 6 | toggle_dark: Ubah ke mode gelap 7 | toggle_langs: Ubah bahasa 8 | intro: 9 | desc: Template awal vite 10 | dynamic-route: Contoh rute dinamik 11 | hi: Halo, {name}! 12 | aka: Juga diketahui sebagai 13 | whats-your-name: Siapa nama anda? 14 | not-found: Tidak ditemukan 15 | -------------------------------------------------------------------------------- /demo/vitesse/locales/vi.yml: -------------------------------------------------------------------------------- 1 | button: 2 | about: Về 3 | back: Quay lại 4 | go: Đi 5 | home: Khởi đầu 6 | toggle_dark: Chuyển đổi chế độ tối 7 | toggle_langs: Thay đổi ngôn ngữ 8 | intro: 9 | desc: Ý kiến cá nhân Vite Template để bắt đầu 10 | dynamic-route: Bản giới thiệu về dynamic route 11 | hi: Hi, {name}! 12 | whats-your-name: Tên bạn là gì? 13 | not-found: Không tìm thấy 14 | -------------------------------------------------------------------------------- /fixtures/yarn-pnp/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "yarn-pnp", 3 | "private": true, 4 | "version": "0.0.0", 5 | "type": "module", 6 | "scripts": { 7 | "dev": "vite", 8 | "build": "vite build", 9 | "preview": "vite preview" 10 | }, 11 | "devDependencies": { 12 | "vite": "5.1.5", 13 | "vite-bundle-visualizer": "portal:../../" 14 | }, 15 | "packageManager": "yarn@4.1.1" 16 | } 17 | -------------------------------------------------------------------------------- /demo/vitesse/locales/de.yml: -------------------------------------------------------------------------------- 1 | button: 2 | about: Über 3 | back: Zurück 4 | go: Los 5 | home: Startseite 6 | toggle_dark: Dunkelmodus umschalten 7 | toggle_langs: Sprachen ändern 8 | intro: 9 | desc: Vite Startvorlage mit Vorlieben 10 | dynamic-route: Demo einer dynamischen Route 11 | hi: Hi, {name}! 12 | aka: Auch bekannt als 13 | whats-your-name: Wie heißt du? 14 | not-found: Nicht gefunden 15 | -------------------------------------------------------------------------------- /demo/vitesse/locales/ka.yml: -------------------------------------------------------------------------------- 1 | button: 2 | about: შესახებ 3 | back: უკან 4 | go: დაწყება 5 | home: მთავარი 6 | toggle_dark: გადართე მუქი რეჟიმი 7 | toggle_langs: ენის შეცვლა 8 | intro: 9 | desc: Opinionated Vite Starter Template 10 | dynamic-route: დინამიური როუტინგის დემო 11 | hi: გამარჯობა, {name}! 12 | aka: ასევე ცნობილი როგორც 13 | whats-your-name: რა გქვია? 14 | not-found: ვერ მოიძებნა 15 | -------------------------------------------------------------------------------- /demo/vitesse/locales/tr.yml: -------------------------------------------------------------------------------- 1 | button: 2 | about: Hakkımda 3 | back: Geri 4 | go: İLERİ 5 | home: Anasayfa 6 | toggle_dark: Karanlık modu değiştir 7 | toggle_langs: Dilleri değiştir 8 | intro: 9 | desc: Görüşlü Vite Başlangıç Şablonu 10 | dynamic-route: Dinamik rota demosu 11 | hi: Merhaba, {name}! 12 | aka: Ayrıca şöyle bilinir 13 | whats-your-name: Adınız nedir? 14 | not-found: Bulunamadı 15 | -------------------------------------------------------------------------------- /demo/vitesse/locales/pl.yml: -------------------------------------------------------------------------------- 1 | button: 2 | about: O nas 3 | back: Wróć 4 | go: WEJDŹ 5 | home: Strona główna 6 | toggle_dark: Ustaw tryb nocny 7 | toggle_langs: Zmień język 8 | intro: 9 | desc: Opiniowany szablon startowy Vite 10 | dynamic-route: Demonstracja dynamicznego route 11 | hi: Cześć, {name}! 12 | aka: Znany też jako 13 | whats-your-name: Jak masz na imię? 14 | not-found: Nie znaleziono 15 | -------------------------------------------------------------------------------- /demo/vitesse/src/modules/nprogress.ts: -------------------------------------------------------------------------------- 1 | import NProgress from 'nprogress' 2 | import { type UserModule } from '~/types' 3 | 4 | export const install: UserModule = ({ isClient, router }) => { 5 | if (isClient) { 6 | router.beforeEach((to, from) => { 7 | if (to.path !== from.path) 8 | NProgress.start() 9 | }) 10 | router.afterEach(() => { 11 | NProgress.done() 12 | }) 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /demo/vitesse/locales/README.md: -------------------------------------------------------------------------------- 1 | ## i18n 2 | 3 | This directory is to serve your locale translation files. YAML under this folder would be loaded automatically and register with their filenames as locale code. 4 | 5 | Check out [`vue-i18n`](https://github.com/intlify/vue-i18n-next) for more details. 6 | 7 | If you are using VS Code, [`i18n Ally`](https://github.com/lokalise/i18n-ally) is recommended to make the i18n experience better. 8 | -------------------------------------------------------------------------------- /demo/vitesse/locales/es.yml: -------------------------------------------------------------------------------- 1 | button: 2 | about: Acerca de 3 | back: Atrás 4 | go: Ir 5 | home: Inicio 6 | toggle_dark: Alternar modo oscuro 7 | toggle_langs: Cambiar idiomas 8 | intro: 9 | desc: Plantilla de Inicio de Vite Dogmática 10 | dynamic-route: Demo de ruta dinámica 11 | hi: ¡Hola, {name}! 12 | aka: También conocido como 13 | whats-your-name: ¿Cómo te llamas? 14 | not-found: No se ha encontrado 15 | -------------------------------------------------------------------------------- /demo/vitesse/locales/pt-BR.yml: -------------------------------------------------------------------------------- 1 | button: 2 | about: Sobre 3 | back: Voltar 4 | go: Ir 5 | home: Início 6 | toggle_dark: Alternar modo escuro 7 | toggle_langs: Mudar de idioma 8 | intro: 9 | desc: Modelo Opinativo de Partida de Vite 10 | dynamic-route: Demonstração de rota dinâmica 11 | hi: Olá, {name}! 12 | aka: Também conhecido como 13 | whats-your-name: Qual é o seu nome? 14 | not-found: Não encontrado 15 | -------------------------------------------------------------------------------- /demo/vitesse/locales/uz.yml: -------------------------------------------------------------------------------- 1 | button: 2 | about: Haqida 3 | back: Orqaga 4 | go: Kettik 5 | home: Bosh sahifa 6 | toggle_dark: Qorong‘i rejimga o‘tish 7 | toggle_langs: Tilni o‘zgartirish 8 | intro: 9 | desc: O‘ylangan boshlang‘ich Vite shabloni 10 | dynamic-route: Dynamic route demo'si 11 | hi: Assalomu alaykum, {name}! 12 | aka: shuningdek 13 | whats-your-name: Ismingiz nima? 14 | not-found: Topilmadi 15 | -------------------------------------------------------------------------------- /fixtures/vite3/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Vite App 8 | 9 | 10 |
11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /fixtures/vite4/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Vite App 8 | 9 | 10 |
11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /demo/react/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | demo 8 | 9 | 10 |
11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /fixtures/yarn-pnp/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Vite App 8 | 9 | 10 |
11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /demo/vitesse/cypress.config.ts: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'cypress' 2 | import vitePreprocessor from 'cypress-vite' 3 | 4 | export default defineConfig({ 5 | e2e: { 6 | baseUrl: 'http://localhost:3333', 7 | chromeWebSecurity: false, 8 | specPattern: 'cypress/e2e/**/*.spec.*', 9 | supportFile: false, 10 | setupNodeEvents(on) { 11 | on('file:preprocessor', vitePreprocessor()) 12 | }, 13 | }, 14 | }) 15 | -------------------------------------------------------------------------------- /demo/vitesse/locales/fr.yml: -------------------------------------------------------------------------------- 1 | button: 2 | about: À propos 3 | back: Retour 4 | go: Essayer 5 | home: Accueil 6 | toggle_dark: Basculer en mode sombre 7 | toggle_langs: Changer de langue 8 | intro: 9 | desc: Exemple d'application Vite 10 | dynamic-route: Démo de route dynamique 11 | hi: Salut, {name}! 12 | aka: Aussi connu sous le nom de 13 | whats-your-name: Comment t'appelles-tu ? 14 | not-found: Page non trouvée 15 | -------------------------------------------------------------------------------- /demo/react/src/index.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 0; 3 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 4 | 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 5 | sans-serif; 6 | -webkit-font-smoothing: antialiased; 7 | -moz-osx-font-smoothing: grayscale; 8 | } 9 | 10 | code { 11 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 12 | monospace; 13 | } 14 | -------------------------------------------------------------------------------- /demo/vitesse/src/components/TheCounter.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 20 | -------------------------------------------------------------------------------- /demo/vitesse/src/components/README.md: -------------------------------------------------------------------------------- 1 | ## Components 2 | 3 | Components in this dir will be auto-registered and on-demand, powered by [`unplugin-vue-components`](https://github.com/antfu/unplugin-vue-components). 4 | 5 | 6 | ### Icons 7 | 8 | You can use icons from almost any icon sets by the power of [Iconify](https://iconify.design/). 9 | 10 | It will only bundle the icons you use. Check out [`unplugin-icons`](https://github.com/antfu/unplugin-icons) for more details. 11 | -------------------------------------------------------------------------------- /demo/vitesse/Dockerfile: -------------------------------------------------------------------------------- 1 | FROM node:16-alpine as build-stage 2 | 3 | WORKDIR /app 4 | RUN corepack enable 5 | 6 | COPY .npmrc package.json pnpm-lock.yaml ./ 7 | RUN --mount=type=cache,id=pnpm-store,target=/root/.pnpm-store \ 8 | pnpm install --frozen-lockfile 9 | 10 | COPY . . 11 | RUN pnpm build 12 | 13 | FROM nginx:stable-alpine as production-stage 14 | 15 | COPY --from=build-stage /app/dist /usr/share/nginx/html 16 | EXPOSE 80 17 | 18 | CMD ["nginx", "-g", "daemon off;"] 19 | -------------------------------------------------------------------------------- /demo/vitesse/src/components/TheInput.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 21 | -------------------------------------------------------------------------------- /demo/vitesse/src/modules/pwa.ts: -------------------------------------------------------------------------------- 1 | import { type UserModule } from '~/types' 2 | 3 | // https://github.com/antfu/vite-plugin-pwa#automatic-reload-when-new-content-available 4 | export const install: UserModule = ({ isClient, router }) => { 5 | if (!isClient) 6 | return 7 | 8 | router.isReady() 9 | .then(async () => { 10 | const { registerSW } = await import('virtual:pwa-register') 11 | registerSW({ immediate: true }) 12 | }) 13 | .catch(() => {}) 14 | } 15 | -------------------------------------------------------------------------------- /demo/vitesse/src/layouts/404.vue: -------------------------------------------------------------------------------- 1 | 5 | 6 | 19 | -------------------------------------------------------------------------------- /demo/vitesse/src/styles/main.css: -------------------------------------------------------------------------------- 1 | @import './markdown.css'; 2 | 3 | html, 4 | body, 5 | #app { 6 | height: 100%; 7 | margin: 0; 8 | padding: 0; 9 | } 10 | 11 | html.dark { 12 | background: #121212; 13 | color-scheme: dark; 14 | } 15 | 16 | #nprogress { 17 | pointer-events: none; 18 | } 19 | 20 | #nprogress .bar { 21 | background: rgb(13,148,136); 22 | opacity: 0.75; 23 | position: fixed; 24 | z-index: 1031; 25 | top: 0; 26 | left: 0; 27 | width: 100%; 28 | height: 2px; 29 | } 30 | -------------------------------------------------------------------------------- /demo/vitesse/src/shims.d.ts: -------------------------------------------------------------------------------- 1 | declare interface Window { 2 | // extend the window 3 | } 4 | 5 | // with vite-plugin-vue-markdown, markdown files can be treated as Vue components 6 | declare module '*.md' { 7 | import { type DefineComponent } from 'vue' 8 | const component: DefineComponent<{}, {}, any> 9 | export default component 10 | } 11 | 12 | declare module '*.vue' { 13 | import { type DefineComponent } from 'vue' 14 | const component: DefineComponent<{}, {}, any> 15 | export default component 16 | } 17 | -------------------------------------------------------------------------------- /demo/vitesse/src/styles/markdown.css: -------------------------------------------------------------------------------- 1 | .prose pre:not(.shiki) { 2 | padding: 0; 3 | } 4 | 5 | .prose .shiki { 6 | font-family: 'DM Mono', monospace; 7 | font-size: 1.2em; 8 | line-height: 1.4; 9 | } 10 | 11 | .prose img { 12 | width: 100%; 13 | } 14 | 15 | .shiki-light { 16 | background: #f8f8f8 !important; 17 | } 18 | .shiki-dark { 19 | background: #0e0e0e !important; 20 | } 21 | 22 | html.dark .shiki-light { 23 | display: none; 24 | } 25 | 26 | html:not(.dark) .shiki-dark { 27 | display: none; 28 | } 29 | -------------------------------------------------------------------------------- /demo/vitesse/src/layouts/README.md: -------------------------------------------------------------------------------- 1 | ## Layouts 2 | 3 | Vue components in this dir are used as layouts. 4 | 5 | By default, `default.vue` will be used unless an alternative is specified in the route meta. 6 | 7 | With [`vite-plugin-pages`](https://github.com/hannoeru/vite-plugin-pages) and [`vite-plugin-vue-layouts`](https://github.com/JohnCampionJr/vite-plugin-vue-layouts), you can specify the layout in the page's SFCs like this: 8 | 9 | ```html 10 | 11 | meta: 12 | layout: home 13 | 14 | ``` 15 | -------------------------------------------------------------------------------- /demo/vitesse/src/pages/README.md: -------------------------------------------------------------------------------- 1 | ## File-based Routing 2 | 3 | Routes will be auto-generated for Vue files in this dir with the same file structure. 4 | Check out [`vite-plugin-pages`](https://github.com/hannoeru/vite-plugin-pages) for more details. 5 | 6 | ### Path Aliasing 7 | 8 | `~/` is aliased to `./src/` folder. 9 | 10 | For example, instead of having 11 | 12 | ```ts 13 | import { isDark } from '../../../../composables' 14 | ``` 15 | 16 | now, you can use 17 | 18 | ```ts 19 | import { isDark } from '~/composables' 20 | ``` 21 | -------------------------------------------------------------------------------- /fixtures/yarn-pnp/.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | pnpm-debug.log* 8 | lerna-debug.log* 9 | 10 | node_modules 11 | dist 12 | dist-ssr 13 | *.local 14 | 15 | # Editor directories and files 16 | .vscode/* 17 | !.vscode/extensions.json 18 | .idea 19 | .DS_Store 20 | *.suo 21 | *.ntvs* 22 | *.njsproj 23 | *.sln 24 | *.sw? 25 | 26 | # Not using Zero-installs 27 | .pnp.* 28 | .yarn/* 29 | !.yarn/patches 30 | !.yarn/plugins 31 | !.yarn/releases 32 | !.yarn/sdks 33 | !.yarn/versions 34 | -------------------------------------------------------------------------------- /demo/vitesse/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "cSpell.words": ["Vitesse", "Vite", "unocss", "vitest", "vueuse", "pinia", "demi", "antfu", "iconify", "intlify", "vitejs", "unplugin", "pnpm"], 3 | "i18n-ally.sourceLanguage": "en", 4 | "i18n-ally.keystyle": "nested", 5 | "i18n-ally.localesPaths": "locales", 6 | "i18n-ally.sortKeys": true, 7 | "prettier.enable": false, 8 | "editor.codeActionsOnSave": { 9 | "source.fixAll.eslint": true 10 | }, 11 | "files.associations": { 12 | "*.css": "postcss" 13 | }, 14 | "editor.formatOnSave": false 15 | } 16 | -------------------------------------------------------------------------------- /demo/react/vite.second.config.ts: -------------------------------------------------------------------------------- 1 | import { PluginOption, defineConfig } from 'vite' 2 | import react from '@vitejs/plugin-react' 3 | import path from 'path' 4 | 5 | function testPlugin(): PluginOption { 6 | return { 7 | name: 'vite-plugin-test', 8 | transform(src, id) { 9 | console.log('transform', id, src.length) 10 | }, 11 | } 12 | } 13 | 14 | // https://vitejs.dev/config/ 15 | export default defineConfig({ 16 | plugins: [react(), testPlugin()], 17 | resolve: { 18 | alias: { 19 | '@': path.resolve(__dirname, 'src') 20 | } 21 | } 22 | }) 23 | -------------------------------------------------------------------------------- /demo/react/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "demo", 3 | "version": "0.0.0", 4 | "type": "module", 5 | "scripts": { 6 | "dev": "vite", 7 | "build": "tsc && vite build", 8 | "serve": "vite preview", 9 | "sizecheck": "node ../../bin.js" 10 | }, 11 | "dependencies": { 12 | "react": "18.2.0", 13 | "react-dom": "18.2.0" 14 | }, 15 | "devDependencies": { 16 | "@types/react": "18.2.43", 17 | "@types/react-dom": "18.2.17", 18 | "@vitejs/plugin-react": "4.2.1", 19 | "typescript": "5.3.3", 20 | "vite": "5.0.6" 21 | }, 22 | "license": "MIT" 23 | } 24 | -------------------------------------------------------------------------------- /demo/vitesse/src/modules/pinia.ts: -------------------------------------------------------------------------------- 1 | import { createPinia } from 'pinia' 2 | import { type UserModule } from '~/types' 3 | 4 | // Setup Pinia 5 | // https://pinia.vuejs.org/ 6 | export const install: UserModule = ({ isClient, initialState, app }) => { 7 | const pinia = createPinia() 8 | app.use(pinia) 9 | // Refer to 10 | // https://github.com/antfu/vite-ssg/blob/main/README.md#state-serialization 11 | // for other serialization strategies. 12 | if (isClient) 13 | pinia.state.value = (initialState.pinia) || {} 14 | 15 | else 16 | initialState.pinia = pinia.state.value 17 | } 18 | -------------------------------------------------------------------------------- /demo/react/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "esnext", 4 | "module": "esnext", 5 | "moduleResolution": "node", 6 | "strict": false, 7 | "sourceMap": true, 8 | "resolveJsonModule": true, 9 | "esModuleInterop": true, 10 | "noEmit": true, 11 | "noUnusedLocals": false, 12 | "noUnusedParameters": true, 13 | "noImplicitReturns": true, 14 | "skipLibCheck": true, 15 | "jsx": "react-jsx", 16 | "baseUrl": "./", 17 | "paths": { 18 | "@/*": [ 19 | "src/*" 20 | ], 21 | }, 22 | }, 23 | "include": [ 24 | "./src" 25 | ] 26 | } 27 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "esnext", 4 | "module": "commonjs", 5 | "moduleResolution": "node", 6 | "allowSyntheticDefaultImports": true, 7 | "esModuleInterop": true, 8 | "noImplicitAny": false, 9 | "experimentalDecorators": true, 10 | "allowJs": true, 11 | "sourceMap": false, 12 | "strict": false, 13 | "alwaysStrict": true, 14 | "strictNullChecks": false, 15 | "importHelpers": true, 16 | "skipLibCheck": true, 17 | "resolveJsonModule": true, 18 | "declaration": true, 19 | "declarationDir": "dist/types", 20 | "outDir": "dist", 21 | }, 22 | "include": [ 23 | "src" 24 | ], 25 | } 26 | -------------------------------------------------------------------------------- /demo/vitesse/src/components.d.ts: -------------------------------------------------------------------------------- 1 | /* eslint-disable */ 2 | /* prettier-ignore */ 3 | // @ts-nocheck 4 | // Generated by unplugin-vue-components 5 | // Read more: https://github.com/vuejs/core/pull/3399 6 | export {} 7 | 8 | declare module 'vue' { 9 | export interface GlobalComponents { 10 | README: typeof import('./components/README.md')['default'] 11 | RouterLink: typeof import('vue-router')['RouterLink'] 12 | RouterView: typeof import('vue-router')['RouterView'] 13 | TheCounter: typeof import('./components/TheCounter.vue')['default'] 14 | TheFooter: typeof import('./components/TheFooter.vue')['default'] 15 | TheInput: typeof import('./components/TheInput.vue')['default'] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /demo/vitesse/src/App.vue: -------------------------------------------------------------------------------- 1 | 23 | 24 | 27 | -------------------------------------------------------------------------------- /.github/workflows/ci.yml: -------------------------------------------------------------------------------- 1 | name: CI 2 | 3 | on: 4 | push: 5 | branches: ["main"] 6 | pull_request: 7 | 8 | jobs: 9 | test: 10 | strategy: 11 | matrix: 12 | os: [ubuntu-latest, windows-latest] 13 | node-version: [18, 20] 14 | 15 | runs-on: ${{ matrix.os }} 16 | 17 | steps: 18 | - uses: actions/checkout@v4 19 | - uses: pnpm/action-setup@v3 20 | with: 21 | version: 8.15.4 22 | - name: Use Node.js ${{ matrix.node-version }} 23 | uses: actions/setup-node@v4 24 | with: 25 | node-version: ${{ matrix.node-version }} 26 | cache: "pnpm" 27 | 28 | - run: corepack enable 29 | 30 | - run: pnpm i --frozen-lockfile -P 31 | 32 | - run: pnpm run test 33 | -------------------------------------------------------------------------------- /demo/vitesse/src/pages/about.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: About 3 | --- 4 | 5 |
6 | 7 |
8 |

About

9 |
10 | 11 | [Vitesse](https://github.com/antfu/vitesse) is an opinionated [Vite](https://github.com/vitejs/vite) starter template made by [@antfu](https://github.com/antfu) for mocking apps swiftly. With **file-based routing**, **components auto importing**, **markdown support**, I18n, PWA and uses **UnoCSS** for styling and icons. 12 | 13 | ```js 14 | // syntax highlighting example 15 | function vitesse() { 16 | const foo = 'bar' 17 | console.log(foo) 18 | } 19 | ``` 20 | 21 | Check out the [GitHub repo](https://github.com/antfu/vitesse) for more details. 22 | -------------------------------------------------------------------------------- /fixtures/vite3/main.js: -------------------------------------------------------------------------------- 1 | import './style.css' 2 | import javascriptLogo from './javascript.svg' 3 | import { setupCounter } from './counter.js' 4 | 5 | document.querySelector('#app').innerHTML = ` 6 |
7 | 8 | 9 | 10 | 11 | 12 | 13 |

Hello Vite!

14 |
15 | 16 |
17 |

18 | Click on the Vite logo to learn more 19 |

20 |
21 | ` 22 | 23 | setupCounter(document.querySelector('#counter')) 24 | -------------------------------------------------------------------------------- /demo/vitesse/src/main.ts: -------------------------------------------------------------------------------- 1 | import { ViteSSG } from 'vite-ssg' 2 | import { setupLayouts } from 'virtual:generated-layouts' 3 | 4 | // import Previewer from 'virtual:vue-component-preview' 5 | import App from './App.vue' 6 | import type { UserModule } from './types' 7 | import generatedRoutes from '~pages' 8 | 9 | import '@unocss/reset/tailwind.css' 10 | import './styles/main.css' 11 | import 'uno.css' 12 | 13 | const routes = setupLayouts(generatedRoutes) 14 | 15 | // https://github.com/antfu/vite-ssg 16 | export const createApp = ViteSSG( 17 | App, 18 | { routes, base: import.meta.env.BASE_URL }, 19 | (ctx) => { 20 | // install all modules under `modules/` 21 | Object.values(import.meta.glob<{ install: UserModule }>('./modules/*.ts', { eager: true })) 22 | .forEach(i => i.install?.(ctx)) 23 | // ctx.app.use(Previewer) 24 | }, 25 | ) 26 | -------------------------------------------------------------------------------- /fixtures/vite4/main.js: -------------------------------------------------------------------------------- 1 | import './style.css' 2 | import javascriptLogo from './javascript.svg' 3 | import viteLogo from '/vite.svg' 4 | import { setupCounter } from './counter.js' 5 | 6 | document.querySelector('#app').innerHTML = ` 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |

Hello Vite!

15 |
16 | 17 |
18 |

19 | Click on the Vite logo to learn more 20 |

21 |
22 | ` 23 | 24 | setupCounter(document.querySelector('#counter')) 25 | -------------------------------------------------------------------------------- /fixtures/yarn-pnp/main.js: -------------------------------------------------------------------------------- 1 | import './style.css' 2 | import javascriptLogo from './javascript.svg' 3 | import viteLogo from '/vite.svg' 4 | import { setupCounter } from './counter.js' 5 | 6 | document.querySelector('#app').innerHTML = ` 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |

Hello Vite!

15 |
16 | 17 |
18 |

19 | Click on the Vite logo to learn more 20 |

21 |
22 | ` 23 | 24 | setupCounter(document.querySelector('#counter')) 25 | -------------------------------------------------------------------------------- /demo/vitesse/cypress/e2e/basic.spec.ts: -------------------------------------------------------------------------------- 1 | context('Basic', () => { 2 | beforeEach(() => { 3 | cy.visit('/') 4 | }) 5 | 6 | it('basic nav', () => { 7 | cy.url() 8 | .should('eq', 'http://localhost:3333/') 9 | 10 | cy.contains('[Home Layout]') 11 | .should('exist') 12 | 13 | cy.get('#input') 14 | .type('Vitesse{Enter}') 15 | .url() 16 | .should('eq', 'http://localhost:3333/hi/Vitesse') 17 | 18 | cy.contains('[Default Layout]') 19 | .should('exist') 20 | 21 | cy.get('[btn]') 22 | .click() 23 | .url() 24 | .should('eq', 'http://localhost:3333/') 25 | }) 26 | 27 | it('markdown', () => { 28 | cy.get('[data-test-id="about"]') 29 | .click() 30 | .url() 31 | .should('eq', 'http://localhost:3333/about') 32 | 33 | cy.get('.shiki') 34 | .should('exist') 35 | }) 36 | }) 37 | -------------------------------------------------------------------------------- /demo/vitesse/test/component.test.ts: -------------------------------------------------------------------------------- 1 | import { mount } from '@vue/test-utils' 2 | import { describe, expect, it } from 'vitest' 3 | import TheCounter from '../src/components/TheCounter.vue' 4 | 5 | describe('TheCounter.vue', () => { 6 | it('should render', () => { 7 | const wrapper = mount(TheCounter, { props: { initial: 10 } }) 8 | expect(wrapper.text()).toContain('10') 9 | expect(wrapper.html()).toMatchSnapshot() 10 | }) 11 | 12 | it('should be interactive', async () => { 13 | const wrapper = mount(TheCounter, { props: { initial: 0 } }) 14 | expect(wrapper.text()).toContain('0') 15 | 16 | expect(wrapper.find('.inc').exists()).toBe(true) 17 | 18 | expect(wrapper.find('.dec').exists()).toBe(true) 19 | 20 | await wrapper.get('.inc').trigger('click') 21 | 22 | expect(wrapper.text()).toContain('1') 23 | 24 | await wrapper.get('.dec').trigger('click') 25 | 26 | expect(wrapper.text()).toContain('0') 27 | }) 28 | }) 29 | -------------------------------------------------------------------------------- /fixtures/vite3/javascript.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /fixtures/vite4/javascript.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /fixtures/yarn-pnp/javascript.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /demo/vitesse/src/stores/user.ts: -------------------------------------------------------------------------------- 1 | import { acceptHMRUpdate, defineStore } from 'pinia' 2 | 3 | export const useUserStore = defineStore('user', () => { 4 | /** 5 | * Current name of the user. 6 | */ 7 | const savedName = ref('') 8 | const previousNames = ref(new Set()) 9 | 10 | const usedNames = computed(() => Array.from(previousNames.value)) 11 | const otherNames = computed(() => usedNames.value.filter(name => name !== savedName.value)) 12 | 13 | /** 14 | * Changes the current name of the user and saves the one that was used 15 | * before. 16 | * 17 | * @param name - new name to set 18 | */ 19 | function setNewName(name: string) { 20 | if (savedName.value) 21 | previousNames.value.add(savedName.value) 22 | 23 | savedName.value = name 24 | } 25 | 26 | return { 27 | setNewName, 28 | otherNames, 29 | savedName, 30 | } 31 | }) 32 | 33 | if (import.meta.hot) 34 | import.meta.hot.accept(acceptHMRUpdate(useUserStore as any, import.meta.hot)) 35 | -------------------------------------------------------------------------------- /demo/vitesse/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | -------------------------------------------------------------------------------- /demo/vitesse/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": ".", 4 | "module": "ESNext", 5 | "target": "ESNext", 6 | "lib": ["DOM", "ESNext"], 7 | "strict": true, 8 | "esModuleInterop": true, 9 | "jsx": "preserve", 10 | "skipLibCheck": true, 11 | "isolatedModules": true, 12 | "moduleResolution": "node", 13 | "resolveJsonModule": true, 14 | "noUnusedLocals": true, 15 | "strictNullChecks": true, 16 | "allowJs": true, 17 | "forceConsistentCasingInFileNames": true, 18 | "types": [ 19 | "vitest", 20 | "vite/client", 21 | "vue/ref-macros", 22 | "vite-plugin-pages/client", 23 | "vite-plugin-vue-component-preview/client", 24 | "vite-plugin-vue-layouts/client", 25 | "vite-plugin-pwa/client", 26 | "unplugin-vue-macros/macros-global" 27 | ], 28 | "paths": { 29 | "~/*": ["src/*"] 30 | } 31 | }, 32 | "vueCompilerOptions": { 33 | "plugins": [ 34 | "@vue-macros/volar/define-models", 35 | "@vue-macros/volar/define-slots" 36 | ] 37 | }, 38 | "exclude": ["dist", "node_modules", "cypress"] 39 | } 40 | -------------------------------------------------------------------------------- /demo/vitesse/uno.config.ts: -------------------------------------------------------------------------------- 1 | import { 2 | defineConfig, 3 | presetAttributify, 4 | presetIcons, 5 | presetTypography, 6 | presetUno, 7 | presetWebFonts, 8 | transformerDirectives, 9 | transformerVariantGroup, 10 | } from 'unocss' 11 | 12 | export default defineConfig({ 13 | shortcuts: [ 14 | ['btn', 'px-4 py-1 rounded inline-block bg-teal-700 text-white cursor-pointer !outline-none hover:bg-teal-800 disabled:cursor-default disabled:bg-gray-600 disabled:opacity-50'], 15 | ['icon-btn', 'inline-block cursor-pointer select-none opacity-75 transition duration-200 ease-in-out hover:opacity-100 hover:text-teal-600'], 16 | ], 17 | presets: [ 18 | presetUno(), 19 | presetAttributify(), 20 | presetIcons({ 21 | scale: 1.2, 22 | warn: true, 23 | }), 24 | presetTypography(), 25 | presetWebFonts({ 26 | fonts: { 27 | sans: 'DM Sans', 28 | serif: 'DM Serif Display', 29 | mono: 'DM Mono', 30 | }, 31 | }), 32 | ], 33 | transformers: [ 34 | transformerDirectives(), 35 | transformerVariantGroup(), 36 | ], 37 | safelist: 'prose m-auto text-left'.split(' '), 38 | }) 39 | -------------------------------------------------------------------------------- /demo/vitesse/LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2020-PRESENT Anthony Fu 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. 22 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2022-present KusStar(https://github.com/KusStar) 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. 22 | -------------------------------------------------------------------------------- /demo/react/LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2022-present KusStar(https://github.com/KusStar) 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. 22 | -------------------------------------------------------------------------------- /demo/vitesse/src/pages/hi/[name].vue: -------------------------------------------------------------------------------- 1 | 11 | 12 | 48 | -------------------------------------------------------------------------------- /demo/vitesse/src/components/TheFooter.vue: -------------------------------------------------------------------------------- 1 | 14 | 15 | 38 | -------------------------------------------------------------------------------- /demo/vitesse/src/pages/index.vue: -------------------------------------------------------------------------------- 1 | 16 | 17 | 52 | 53 | 54 | meta: 55 | layout: home 56 | 57 | -------------------------------------------------------------------------------- /fixtures/vite3/public/vite.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /fixtures/vite4/public/vite.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /fixtures/yarn-pnp/public/vite.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "vite-bundle-visualizer", 3 | "description": "Visualize vite bundle", 4 | "version": "1.2.1", 5 | "type": "module", 6 | "bin": { 7 | "vite-bundle-visualizer": "bin.js" 8 | }, 9 | "files": [ 10 | "index.js", 11 | "index.d.ts", 12 | "bin.js" 13 | ], 14 | "keywords": [ 15 | "vite", 16 | "bundle-visualizer", 17 | "bundle-analyzer" 18 | ], 19 | "homepage": "https://github.com/KusStar/vite-bundle-visualizer#readme", 20 | "repository": "KusStar/vite-bundle-visualizer", 21 | "license": "MIT", 22 | "author": "KusStar (https://github.com/KusStar)", 23 | "exports": "./index.js", 24 | "types": "./index.d.ts", 25 | "scripts": { 26 | "pub": "release-it", 27 | "test": "pnpm run test:vite3 --open false && pnpm run test:vite4 --open false && pnpm run test:yarn-pnp --open false && pnpm run test:demo --open false", 28 | "test:vite3": "cd fixtures/vite3 && pnpm i && pnpm vite-bundle-visualizer", 29 | "test:vite4": "cd fixtures/vite4 && pnpm i && pnpm vite-bundle-visualizer", 30 | "test:yarn-pnp": "cd fixtures/yarn-pnp && yarn && yarn vite-bundle-visualizer", 31 | "test:demo": "cd demo/react && pnpm i && pnpm run sizecheck" 32 | }, 33 | "dependencies": { 34 | "cac": "^6.7.14", 35 | "import-from-esm": "^1.3.3", 36 | "rollup-plugin-visualizer": "^5.11.0", 37 | "tmp": "^0.2.1" 38 | }, 39 | "devDependencies": { 40 | "@types/node": "^18.19.3", 41 | "release-it": "^17.0.1", 42 | "vite": "^5.0.7" 43 | }, 44 | "engines": { 45 | "node": "^18.19.0 || >=20.6.0" 46 | } 47 | } 48 | -------------------------------------------------------------------------------- /bin.js: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env node 2 | 3 | import cac from 'cac' 4 | import * as path from 'node:path' 5 | import * as tmp from 'tmp' 6 | import start from './index.js' 7 | 8 | const cli = cac('vite-bundle-visualizer') 9 | 10 | const tmpobj = tmp.dirSync(); 11 | 12 | const DEFAULT_OUTPUT = path.join(tmpobj.name, 'stats.html'); 13 | 14 | cli.help() 15 | 16 | cli.option('--template -t