create SvelteKit example

2025-01-30 22:08:02 +00:00 · 2023-01-12 19:13:11 +09:00 · 2023-01-12 19:13:11 +09:00 · 35ac9c5c71
commit 35ac9c5c71
parent bf8dc82ce9
19 changed files with 1501 additions and 0 deletions
--- a/svelte/.eslintignore
+++ b/svelte/.eslintignore
@ -0,0 +1,13 @@
+.DS_Store
+node_modules
+/build
+/.svelte-kit
+/package
+.env
+.env.*
+!.env.example
+
+# Ignore files for PNPM, NPM and YARN
+pnpm-lock.yaml
+package-lock.json
+yarn.lock
--- a/svelte/.eslintrc.cjs
+++ b/svelte/.eslintrc.cjs
@ -0,0 +1,15 @@
+module.exports = {
+  root: true,
+  extends: ["eslint:recommended"],
+  plugins: ["svelte3"],
+  overrides: [{ files: ["*.svelte"], processor: "svelte3/svelte3" }],
+  parserOptions: {
+    sourceType: "module",
+    ecmaVersion: 2020,
+  },
+  env: {
+    browser: true,
+    es2017: true,
+    node: true,
+  },
+};
--- a/svelte/.gitignore
+++ b/svelte/.gitignore
@ -0,0 +1,12 @@
+.DS_Store
+node_modules
+/build
+/.svelte-kit
+/package
+.env
+.env.*
+!.env.example
+.vercel
+.output
+vite.config.js.timestamp-*
+vite.config.ts.timestamp-*
--- a/svelte/.npmrc
+++ b/svelte/.npmrc
@ -0,0 +1 @@
+engine-strict=true
--- a/svelte/README.md
+++ b/svelte/README.md
@ -0,0 +1 @@
+# svelte example
--- a/svelte/jsconfig.json
+++ b/svelte/jsconfig.json
@ -0,0 +1,17 @@
+{
+	"extends": "./.svelte-kit/tsconfig.json",
+	"compilerOptions": {
+		"allowJs": true,
+		"checkJs": true,
+		"esModuleInterop": true,
+		"forceConsistentCasingInFileNames": true,
+		"resolveJsonModule": true,
+		"skipLibCheck": true,
+		"sourceMap": true,
+		"strict": true
+	}
+	// Path aliases are handled by https://kit.svelte.dev/docs/configuration#alias and https://kit.svelte.dev/docs/configuration#files
+	//
+	// If you want to overwrite includes/excludes, make sure to copy over the relevant includes/excludes
+	// from the referenced tsconfig.json - TypeScript does not merge them in
+}
--- a/svelte/package.json
+++ b/svelte/package.json
@ -0,0 +1,25 @@
+{
+  "name": "svelte-example",
+  "version": "0.0.1",
+  "scripts": {
+    "dev": "vite dev",
+    "build": "vite build",
+    "preview": "vite preview",
+    "check": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json",
+    "check:watch": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json --watch",
+    "lint": "eslint ."
+  },
+  "devDependencies": {
+    "@neoconfetti/svelte": "^1.0.0",
+    "@sveltejs/adapter-auto": "^1.0.0",
+    "@sveltejs/kit": "^1.0.0",
+    "@types/cookie": "^0.5.1",
+    "eslint": "^8.28.0",
+    "eslint-plugin-svelte3": "^4.0.0",
+    "svelte": "^3.54.0",
+    "svelte-check": "^2.9.2",
+    "typescript": "^4.9.3",
+    "vite": "^4.0.0"
+  },
+  "type": "module"
+}
--- a/svelte/src/app.d.ts
+++ b/svelte/src/app.d.ts
@ -0,0 +1,9 @@
+// See https://kit.svelte.dev/docs/types#app
+// for information about these interfaces
+// and what to do when importing types
+declare namespace App {
+	// interface Error {}
+	// interface Locals {}
+	// interface PageData {}
+	// interface Platform {}
+}
--- a/svelte/src/app.html
+++ b/svelte/src/app.html
@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="">
+  <head>
+    <meta charset="utf-8" />
+    <!-- <link rel="icon" href="%sveltekit.assets%/favicon.png" /> -->
+    <meta name="viewport" content="width=device-width" />
+    %sveltekit.head%
+  </head>
+  <body data-sveltekit-preload-data="hover">
+    <div style="display: contents">%sveltekit.body%</div>
+  </body>
+</html>
--- a/svelte/src/lib/images/icon.svg
+++ b/svelte/src/lib/images/icon.svg
@ -0,0 +1,11 @@
+<svg width="128" height="128" viewBox="0 0 128 128" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0)">
+<rect width="128" height="128" fill="white"/>
+<path d="M-11.5 123L58 36.5V39L65.5 48.5V45.5L74.5 32L75.5 35L146.5 107M55 55V61.75V68.5M58 84L41.5 134.5M71.5 83.1595C84.3251 79.7953 91 73.3435 93.5 70C96 66.6565 105.5 49 100 35C93.8678 19.3908 79 15 59.5 15C36.9113 15 25.5 35 23.5 45.5C20.0997 63.3518 30.5 84.4217 65.5 84C67.5435 83.9754 69.5523 83.6704 71.5 83.1595ZM71.5 83.1595L84.5 134.5M74.5 55V61.75V68.5" stroke="#585858" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+<defs>
+<clipPath id="clip0">
+<rect width="128" height="128" fill="white"/>
+</clipPath>
+</defs>
+</svg>
--- a/svelte/src/routes/+layout.svelte
+++ b/svelte/src/routes/+layout.svelte
@ -0,0 +1,12 @@
+<script>
+  import Header from "./Header.svelte";
+  import "./styles.css";
+</script>
+
+<div class="app">
+  <Header />
+
+  <main>
+    <slot />
+  </main>
+</div>
--- a/svelte/src/routes/+page.js
+++ b/svelte/src/routes/+page.js
--- a/svelte/src/routes/+page.svelte
+++ b/svelte/src/routes/+page.svelte
@ -0,0 +1,18 @@
+<script>
+  import Counter from "./Counter.svelte";
+  import icon from "$lib/images/icon.svg";
+</script>
+
+<svelte:head>
+  <title>Home</title>
+</svelte:head>
+
+<section>
+  <h1>
+    <picture>
+      <img src={icon} alt="Welcome" />
+    </picture>
+  </h1>
+
+  <Counter />
+</section>
--- a/svelte/src/routes/Counter.svelte
+++ b/svelte/src/routes/Counter.svelte
@ -0,0 +1,9 @@
+<script>
+  let count = 0;
+</script>
+
+<div class="counter">
+  <button on:click={() => count--}> - </button>
+  <strong>{count}</strong>
+  <button on:click={() => count++}> + </button>
+</div>
--- a/svelte/src/routes/Header.svelte
+++ b/svelte/src/routes/Header.svelte
@ -0,0 +1,5 @@
+<header>
+  <div class="corner">
+    <a href="https://kit.svelte.dev">Svelte</a>
+  </div>
+</header>
--- a/svelte/src/routes/styles.css
+++ b/svelte/src/routes/styles.css
--- a/svelte/svelte.config.js
+++ b/svelte/svelte.config.js
@ -0,0 +1,10 @@
+import adapter from "@sveltejs/adapter-auto";
+
+/** @type {import('@sveltejs/kit').Config} */
+const config = {
+  kit: {
+    adapter: adapter(),
+  },
+};
+
+export default config;
--- a/svelte/vite.config.js
+++ b/svelte/vite.config.js
@ -0,0 +1,8 @@
+import { sveltekit } from "@sveltejs/kit/vite";
+
+/** @type {import('vite').UserConfig} */
+const config = {
+  plugins: [sveltekit()],
+};
+
+export default config;
--- a/svelte/yarn.lock
+++ b/svelte/yarn.lock