Skip to content

Commit b75edb3

Browse files
committed
chore: added sveltekit
1 parent a5956c0 commit b75edb3

16 files changed

+3478
-1
lines changed

.eslintrc.cjs

+24
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
module.exports = {
2+
root: true,
3+
parser: '@typescript-eslint/parser',
4+
extends: [
5+
'eslint:recommended',
6+
'plugin:@typescript-eslint/recommended',
7+
'prettier',
8+
],
9+
plugins: ['svelte3', '@typescript-eslint'],
10+
ignorePatterns: ['*.cjs'],
11+
overrides: [{ files: ['*.svelte'], processor: 'svelte3/svelte3' }],
12+
settings: {
13+
'svelte3/typescript': () => require('typescript'),
14+
},
15+
parserOptions: {
16+
sourceType: 'module',
17+
ecmaVersion: 2019,
18+
},
19+
env: {
20+
browser: true,
21+
es2017: true,
22+
node: true,
23+
},
24+
}

.gitignore

+12
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
.DS_Store
2+
node_modules
3+
/build
4+
/.svelte-kit
5+
/package
6+
.yarn/*
7+
!.yarn/patches
8+
!.yarn/releases
9+
!.yarn/plugins
10+
!.yarn/sdks
11+
!.yarn/versions
12+
.pnp.*

.prettierrc

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
{
2+
"semi": false,
3+
"singleQuote": true
4+
}

.yarn/releases/yarn-3.0.1.cjs

+631
Large diffs are not rendered by default.

.yarnrc.yml

+2
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
yarnPath: .yarn/releases/yarn-3.0.1.cjs
2+
nodeLinker: node-modules

README.md

+9-1
Original file line numberDiff line numberDiff line change
@@ -1 +1,9 @@
1-
# svelte-tutorial
1+
# svelte-tutorial
2+
3+
## Developing
4+
5+
Once you've installed all dependencies with `yarn install`, start a development server:
6+
7+
```bash
8+
yarn dev
9+
```

jsconfig.json

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
{
2+
"compilerOptions": {
3+
"baseUrl": ".",
4+
"paths": {
5+
"$lib": ["src/lib"],
6+
"$lib/*": ["src/lib/*"]
7+
}
8+
},
9+
"include": ["src/**/*.d.ts", "src/**/*.js", "src/**/*.svelte"]
10+
}

package.json

+29
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
{
2+
"name": "svelte-tutorial",
3+
"version": "0.0.1",
4+
"scripts": {
5+
"dev": "svelte-kit dev",
6+
"build": "svelte-kit build",
7+
"preview": "svelte-kit preview",
8+
"check": "svelte-check --tsconfig ./tsconfig.json",
9+
"check:watch": "svelte-check --tsconfig ./tsconfig.json --watch",
10+
"lint": "prettier --ignore-path .gitignore --check --plugin-search-dir=. . && eslint --ignore-path .gitignore .",
11+
"format": "prettier --ignore-path .gitignore --write --plugin-search-dir=. ."
12+
},
13+
"devDependencies": {
14+
"@sveltejs/kit": "next",
15+
"@typescript-eslint/eslint-plugin": "^4.19.0",
16+
"@typescript-eslint/parser": "^4.19.0",
17+
"eslint": "^7.22.0",
18+
"eslint-config-prettier": "^8.1.0",
19+
"eslint-plugin-svelte3": "^3.2.0",
20+
"prettier": "~2.2.1",
21+
"prettier-plugin-svelte": "^2.2.0",
22+
"svelte": "^3.34.0",
23+
"svelte-check": "^2.0.0",
24+
"svelte-preprocess": "^4.0.0",
25+
"tslib": "^2.0.0",
26+
"typescript": "^4.0.0"
27+
},
28+
"type": "module"
29+
}

src/app.css

+107
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,107 @@
1+
@import '@fontsource/fira-mono';
2+
3+
:root {
4+
font-family: Arial, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
5+
Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
6+
--font-mono: 'Fira Mono', monospace;
7+
--pure-white: #ffffff;
8+
--primary-color: #b9c6d2;
9+
--secondary-color: #d0dde9;
10+
--tertiary-color: #edf0f8;
11+
--accent-color: #ff3e00;
12+
--heading-color: rgba(0, 0, 0, 0.7);
13+
--text-color: #444444;
14+
--background-without-opacity: rgba(255, 255, 255, 0.7);
15+
--column-width: 42rem;
16+
--column-margin-top: 4rem;
17+
}
18+
19+
body {
20+
min-height: 100vh;
21+
margin: 0;
22+
background-color: var(--primary-color);
23+
background: linear-gradient(
24+
180deg,
25+
var(--primary-color) 0%,
26+
var(--secondary-color) 10.45%,
27+
var(--tertiary-color) 41.35%
28+
);
29+
}
30+
31+
body::before {
32+
content: '';
33+
width: 80vw;
34+
height: 100vh;
35+
position: absolute;
36+
top: 0;
37+
left: 10vw;
38+
z-index: -1;
39+
background: radial-gradient(
40+
50% 50% at 50% 50%,
41+
var(--pure-white) 0%,
42+
rgba(255, 255, 255, 0) 100%
43+
);
44+
opacity: 0.05;
45+
}
46+
47+
#svelte {
48+
min-height: 100vh;
49+
display: flex;
50+
flex-direction: column;
51+
}
52+
53+
h1,
54+
h2,
55+
p {
56+
font-weight: 400;
57+
color: var(--heading-color);
58+
}
59+
60+
p {
61+
line-height: 1.5;
62+
}
63+
64+
a {
65+
color: var(--accent-color);
66+
text-decoration: none;
67+
}
68+
69+
a:hover {
70+
text-decoration: underline;
71+
}
72+
73+
h1 {
74+
font-size: 2rem;
75+
text-align: center;
76+
}
77+
78+
h2 {
79+
font-size: 1rem;
80+
}
81+
82+
pre {
83+
font-size: 16px;
84+
font-family: var(--font-mono);
85+
background-color: rgba(255, 255, 255, 0.45);
86+
border-radius: 3px;
87+
box-shadow: 2px 2px 6px rgb(255 255 255 / 25%);
88+
padding: 0.5em;
89+
overflow-x: auto;
90+
color: var(--text-color);
91+
}
92+
93+
input,
94+
button {
95+
font-size: inherit;
96+
font-family: inherit;
97+
}
98+
99+
button:focus:not(:focus-visible) {
100+
outline: none;
101+
}
102+
103+
@media (min-width: 720px) {
104+
h1 {
105+
font-size: 2.4rem;
106+
}
107+
}

src/app.html

+12
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<link rel="icon" href="/favicon.png" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1" />
7+
%svelte.head%
8+
</head>
9+
<body>
10+
<div id="svelte">%svelte.body%</div>
11+
</body>
12+
</html>

src/global.d.ts

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
/// <reference types="@sveltejs/kit" />

src/routes/index.svelte

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
<h1>Welcome to SvelteKit</h1>
2+
<p>
3+
Visit <a href="https://kit.svelte.dev">kit.svelte.dev</a> to read the documentation
4+
</p>

static/favicon.png

1.53 KB
Loading

svelte.config.js

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import preprocess from 'svelte-preprocess'
2+
3+
/** @type {import('@sveltejs/kit').Config} */
4+
const config = {
5+
// Consult https://github.com/sveltejs/svelte-preprocess
6+
// for more information about preprocessors
7+
preprocess: preprocess(),
8+
9+
kit: {
10+
// hydrate the <div id="svelte"> element in src/app.html
11+
target: '#svelte',
12+
},
13+
}
14+
15+
export default config

tsconfig.json

+31
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
{
2+
"compilerOptions": {
3+
"moduleResolution": "node",
4+
"module": "es2020",
5+
"lib": ["es2020", "DOM"],
6+
"target": "es2019",
7+
/**
8+
svelte-preprocess cannot figure out whether you have a value or a type, so tell TypeScript
9+
to enforce using \`import type\` instead of \`import\` for Types.
10+
*/
11+
"importsNotUsedAsValues": "error",
12+
"isolatedModules": true,
13+
"resolveJsonModule": true,
14+
/**
15+
To have warnings/errors of the Svelte compiler at the correct position,
16+
enable source maps by default.
17+
*/
18+
"sourceMap": true,
19+
"esModuleInterop": true,
20+
"skipLibCheck": true,
21+
"forceConsistentCasingInFileNames": true,
22+
"baseUrl": ".",
23+
"allowJs": true,
24+
"checkJs": true,
25+
"paths": {
26+
"$lib": ["src/lib"],
27+
"$lib/*": ["src/lib/*"]
28+
}
29+
},
30+
"include": ["src/**/*.d.ts", "src/**/*.js", "src/**/*.ts", "src/**/*.svelte"]
31+
}

0 commit comments

Comments
 (0)