sv
Version:
A command line interface (CLI) for creating and maintaining Svelte applications
50 lines • 6.69 kB
JSON
[
{
"name": ".vscode/extensions.json",
"contents": "{\n \"recommendations\": [\"svelte.svelte-vscode\"]\n}\n"
},
{
"name": "index.html",
"contents": "<!doctype html>\n<html lang=\"en\">\n <head>\n <meta charset=\"UTF-8\" />\n <link rel=\"icon\" type=\"image/svg+xml\" href=\"/vite.svg\" />\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" />\n <title>Vite + Svelte + TS</title>\n </head>\n <body>\n <div id=\"app\"></div>\n <script type=\"module\" src=\"/src/main.ts\"></script>\n </body>\n</html>\n"
},
{
"name": "package.json",
"contents": "{\n \"name\": \"vite-svelte-ts-starter\",\n \"private\": true,\n \"version\": \"0.0.0\",\n \"type\": \"module\",\n \"scripts\": {\n \"dev\": \"vite\",\n \"build\": \"vite build\",\n \"preview\": \"vite preview\",\n \"check\": \"svelte-check --tsconfig ./tsconfig.app.json && tsc -p tsconfig.node.json\"\n },\n \"devDependencies\": {\n \"@sveltejs/vite-plugin-svelte\": \"^6.2.1\",\n \"@tsconfig/svelte\": \"^5.0.6\",\n \"@types/node\": \"^24.10.1\",\n \"svelte\": \"^5.45.2\",\n \"svelte-check\": \"^4.3.4\",\n \"typescript\": \"~5.9.3\",\n \"vite\": \"^7.3.1\"\n }\n}\n"
},
{
"name": "src/App.svelte",
"contents": "<script lang=\"ts\">\n import svelteLogo from './assets/svelte.svg'\n import viteLogo from '/vite.svg'\n import Counter from './lib/Counter.svelte'\n</script>\n\n<main>\n <div>\n <a href=\"https://vite.dev\" target=\"_blank\" rel=\"noreferrer\">\n <img src={viteLogo} class=\"logo\" alt=\"Vite Logo\" />\n </a>\n <a href=\"https://svelte.dev\" target=\"_blank\" rel=\"noreferrer\">\n <img src={svelteLogo} class=\"logo svelte\" alt=\"Svelte Logo\" />\n </a>\n </div>\n <h1>Vite + Svelte</h1>\n\n <div class=\"card\">\n <Counter />\n </div>\n\n <p>\n Check out <a href=\"https://github.com/sveltejs/kit#readme\" target=\"_blank\" rel=\"noreferrer\">SvelteKit</a>, the official Svelte app framework powered by Vite!\n </p>\n\n <p class=\"read-the-docs\">\n Click on the Vite and Svelte logos to learn more\n </p>\n</main>\n\n<style>\n .logo {\n height: 6em;\n padding: 1.5em;\n will-change: filter;\n transition: filter 300ms;\n }\n .logo:hover {\n filter: drop-shadow(0 0 2em #646cffaa);\n }\n .logo.svelte:hover {\n filter: drop-shadow(0 0 2em #ff3e00aa);\n }\n .read-the-docs {\n color: #888;\n }\n</style>\n"
},
{
"name": "src/app.css",
"contents": ":root {\n font-family: system-ui, Avenir, Helvetica, Arial, sans-serif;\n line-height: 1.5;\n font-weight: 400;\n\n color-scheme: light dark;\n color: rgba(255, 255, 255, 0.87);\n background-color: #242424;\n\n font-synthesis: none;\n text-rendering: optimizeLegibility;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n\na {\n font-weight: 500;\n color: #646cff;\n text-decoration: inherit;\n}\na:hover {\n color: #535bf2;\n}\n\nbody {\n margin: 0;\n display: flex;\n place-items: center;\n min-width: 320px;\n min-height: 100vh;\n}\n\nh1 {\n font-size: 3.2em;\n line-height: 1.1;\n}\n\n.card {\n padding: 2em;\n}\n\n#app {\n max-width: 1280px;\n margin: 0 auto;\n padding: 2rem;\n text-align: center;\n}\n\nbutton {\n border-radius: 8px;\n border: 1px solid transparent;\n padding: 0.6em 1.2em;\n font-size: 1em;\n font-weight: 500;\n font-family: inherit;\n background-color: #1a1a1a;\n cursor: pointer;\n transition: border-color 0.25s;\n}\nbutton:hover {\n border-color: #646cff;\n}\nbutton:focus,\nbutton:focus-visible {\n outline: 4px auto -webkit-focus-ring-color;\n}\n\n@media (prefers-color-scheme: light) {\n :root {\n color: #213547;\n background-color: #ffffff;\n }\n a:hover {\n color: #747bff;\n }\n button {\n background-color: #f9f9f9;\n }\n}\n"
},
{
"name": "src/lib/Counter.svelte",
"contents": "<script lang=\"ts\">\n let count: number = $state(0)\n const increment = () => {\n count += 1\n }\n</script>\n\n<button onclick={increment}>\n count is {count}\n</button>\n"
},
{
"name": "src/main.ts",
"contents": "import { mount } from 'svelte'\nimport './app.css'\nimport App from './App.svelte'\n\nconst app = mount(App, {\n target: document.getElementById('app')!,\n})\n\nexport default app\n"
},
{
"name": "svelte.config.js",
"contents": "import { vitePreprocess } from '@sveltejs/vite-plugin-svelte'\n\n/** @type {import(\"@sveltejs/vite-plugin-svelte\").SvelteConfig} */\nexport default {\n // Consult https://svelte.dev/docs#compile-time-svelte-preprocess\n // for more information about preprocessors\n preprocess: vitePreprocess(),\n}\n"
},
{
"name": "tsconfig.app.json",
"contents": "{\n \"extends\": \"@tsconfig/svelte/tsconfig.json\",\n \"compilerOptions\": {\n \"tsBuildInfoFile\": \"./node_modules/.tmp/tsconfig.app.tsbuildinfo\",\n \"target\": \"ES2022\",\n \"useDefineForClassFields\": true,\n \"module\": \"ESNext\",\n \"types\": [\"svelte\", \"vite/client\"],\n \"noEmit\": true,\n /**\n * Typecheck JS in `.svelte` and `.js` files by default.\n * Disable checkJs if you'd like to use dynamic types in JS.\n * Note that setting allowJs false does not prevent the use\n * of JS in `.svelte` files.\n */\n \"allowJs\": true,\n \"checkJs\": true,\n \"moduleDetection\": \"force\"\n },\n \"include\": [\"src/**/*.ts\", \"src/**/*.js\", \"src/**/*.svelte\"]\n}\n"
},
{
"name": "tsconfig.json",
"contents": "{\n \"files\": [],\n \"references\": [\n { \"path\": \"./tsconfig.app.json\" },\n { \"path\": \"./tsconfig.node.json\" }\n ]\n}\n"
},
{
"name": "tsconfig.node.json",
"contents": "{\n \"compilerOptions\": {\n \"tsBuildInfoFile\": \"./node_modules/.tmp/tsconfig.node.tsbuildinfo\",\n \"target\": \"ES2023\",\n \"lib\": [\"ES2023\"],\n \"module\": \"ESNext\",\n \"types\": [\"node\"],\n \"skipLibCheck\": true,\n\n /* Bundler mode */\n \"moduleResolution\": \"bundler\",\n \"allowImportingTsExtensions\": true,\n \"verbatimModuleSyntax\": true,\n \"moduleDetection\": \"force\",\n \"noEmit\": true,\n\n /* Linting */\n \"strict\": true,\n \"noUnusedLocals\": true,\n \"noUnusedParameters\": true,\n \"erasableSyntaxOnly\": true,\n \"noFallthroughCasesInSwitch\": true,\n \"noUncheckedSideEffectImports\": true\n },\n \"include\": [\"vite.config.ts\"]\n}\n"
},
{
"name": "vite.config.ts",
"contents": "import { defineConfig } from 'vite'\nimport { svelte } from '@sveltejs/vite-plugin-svelte'\n\n// https://vite.dev/config/\nexport default defineConfig({\n plugins: [svelte()],\n})\n"
}
]