feat: initializes prettier

This commit is contained in:
Dennis Schoepf 2026-02-16 22:01:20 +01:00
parent 51c42eb80d
commit 0c4f160800
10 changed files with 2547 additions and 1484 deletions

11
.prettierrc Normal file
View file

@ -0,0 +1,11 @@
{
"plugins": ["prettier-plugin-astro"],
"overrides": [
{
"files": "*.astro",
"options": {
"parser": "astro"
}
}
]
}

View file

@ -101,17 +101,17 @@ import * as React from "react";
```typescript ```typescript
// Good // Good
interface Props { interface Props {
title: string; title: string;
description?: string; description?: string;
} }
function greet(name: string): string { function greet(name: string): string {
return `Hello, ${name}`; return `Hello, ${name}`;
} }
// Avoid // Avoid
function greet(name): any { function greet(name): any {
return "Hello, " + name; return "Hello, " + name;
} }
``` ```
@ -134,8 +134,8 @@ function greet(name): any {
```astro ```astro
--- ---
interface Props { interface Props {
title: string; title: string;
class?: string; class?: string;
} }
const { title, class: className } = Astro.props; const { title, class: className } = Astro.props;
@ -144,9 +144,9 @@ const { title, class: className } = Astro.props;
<h1 class={className}>{title}</h1> <h1 class={className}>{title}</h1>
<style> <style>
h1 { h1 {
color: var(--text-color); color: var(--text-color);
} }
</style> </style>
``` ```
@ -159,11 +159,11 @@ const { title, class: className } = Astro.props;
```typescript ```typescript
try { try {
const data = await fetchData(); const data = await fetchData();
return data; return data;
} catch (error) { } catch (error) {
console.error("Failed to fetch data:", error); console.error("Failed to fetch data:", error);
throw new Error(`Data fetch failed: ${error.message}`); throw new Error(`Data fetch failed: ${error.message}`);
} }
``` ```
@ -183,7 +183,7 @@ try {
* @returns Formatted date string * @returns Formatted date string
*/ */
function formatDate(date: Date, locale = "en-US"): string { function formatDate(date: Date, locale = "en-US"): string {
return date.toLocaleDateString(locale); return date.toLocaleDateString(locale);
} }
``` ```
@ -204,6 +204,7 @@ The Nix shell provides: Node.js, pnpm, Biome, PostgreSQL, and language servers.
## VS Code Integration ## VS Code Integration
Recommended extensions are configured in `.vscode/extensions.json`: Recommended extensions are configured in `.vscode/extensions.json`:
- Astro language support - Astro language support
- Biome for formatting/linting - Biome for formatting/linting

View file

@ -32,9 +32,9 @@ To learn more about the folder structure of an Astro project, refer to [our guid
All commands are run from the root of the project, from a terminal: All commands are run from the root of the project, from a terminal:
| Command | Action | | Command | Action |
| :------------------------ | :----------------------------------------------- | | :--------------------- | :----------------------------------------------- |
| `pnpm install` | Installs dependencies | | `pnpm install` | Installs dependencies |
| `pnpm dev` | Starts local dev server at `localhost:4321` | | `pnpm dev` | Starts local dev server at `localhost:4321` |
| `pnpm build` | Build your production site to `./dist/` | | `pnpm build` | Build your production site to `./dist/` |
| `pnpm preview` | Preview your build locally, before deploying | | `pnpm preview` | Preview your build locally, before deploying |

View file

@ -1,52 +0,0 @@
{
"$schema": "https://biomejs.dev/schemas/2.4.1/schema.json",
"vcs": {
"enabled": true,
"clientKind": "git",
"useIgnoreFile": true
},
"files": {
"ignoreUnknown": false,
"includes": ["**", "!**/nix/store"]
},
"formatter": {
"enabled": true,
"indentStyle": "tab"
},
"linter": {
"enabled": true,
"rules": {
"recommended": true
}
},
"javascript": {
"formatter": {
"quoteStyle": "double"
}
},
"assist": {
"enabled": true,
"actions": {
"source": {
"organizeImports": "on"
}
}
},
"overrides": [
{
"includes": ["**/*.svelte", "**/*.astro", "**/*.vue"],
"linter": {
"rules": {
"style": {
"useConst": "off",
"useImportType": "off"
},
"correctness": {
"noUnusedVariables": "off",
"noUnusedImports": "off"
}
}
}
}
]
}

View file

@ -1,18 +1,19 @@
{ {
"name": "dnsc-io", "name": "dnsc-io",
"type": "module", "type": "module",
"version": "0.0.1", "version": "0.0.1",
"scripts": { "scripts": {
"dev": "astro dev", "dev": "astro dev",
"build": "astro build", "build": "astro build",
"preview": "astro preview", "preview": "astro preview",
"astro": "astro", "astro": "astro",
"lint": "biome check --write ." "format": "pnpm exec prettier . --write"
}, },
"dependencies": { "dependencies": {
"astro": "^5.17.1" "astro": "^5.17.1"
}, },
"devDependencies": { "devDependencies": {
"@biomejs/biome": "2.4.1" "prettier": "3.8.1",
} "prettier-plugin-astro": "0.14.1"
}
} }

3498
pnpm-lock.yaml generated

File diff suppressed because it is too large Load diff

View file

@ -4,207 +4,217 @@ import background from "../assets/background.svg";
--- ---
<div id="container"> <div id="container">
<img id="background" src={background.src} alt="" fetchpriority="high" /> <img id="background" src={background.src} alt="" fetchpriority="high" />
<main> <main>
<section id="hero"> <section id="hero">
<a href="https://astro.build" <a href="https://astro.build"
><img src={astroLogo.src} width="115" height="48" alt="Astro Homepage" /></a ><img
> src={astroLogo.src}
<h1> width="115"
To get started, open the <code><pre>src/pages</pre></code> directory in your project. height="48"
</h1> alt="Astro Homepage"
<section id="links"> /></a
<a class="button" href="https://docs.astro.build">Read our docs</a> >
<a href="https://astro.build/chat" <h1>
>Join our Discord <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 127.14 96.36" To get started, open the <code><pre>src/pages</pre></code> directory in your
><path project.
fill="currentColor" </h1>
d="M107.7 8.07A105.15 105.15 0 0 0 81.47 0a72.06 72.06 0 0 0-3.36 6.83 97.68 97.68 0 0 0-29.11 0A72.37 72.37 0 0 0 45.64 0a105.89 105.89 0 0 0-26.25 8.09C2.79 32.65-1.71 56.6.54 80.21a105.73 105.73 0 0 0 32.17 16.15 77.7 77.7 0 0 0 6.89-11.11 68.42 68.42 0 0 1-10.85-5.18c.91-.66 1.8-1.34 2.66-2a75.57 75.57 0 0 0 64.32 0c.87.71 1.76 1.39 2.66 2a68.68 68.68 0 0 1-10.87 5.19 77 77 0 0 0 6.89 11.1 105.25 105.25 0 0 0 32.19-16.14c2.64-27.38-4.51-51.11-18.9-72.15ZM42.45 65.69C36.18 65.69 31 60 31 53s5-12.74 11.43-12.74S54 46 53.89 53s-5.05 12.69-11.44 12.69Zm42.24 0C78.41 65.69 73.25 60 73.25 53s5-12.74 11.44-12.74S96.23 46 96.12 53s-5.04 12.69-11.43 12.69Z" <section id="links">
></path></svg <a class="button" href="https://docs.astro.build">Read our docs</a>
> <a href="https://astro.build/chat"
</a> >Join our Discord <svg
</section> xmlns="http://www.w3.org/2000/svg"
</section> viewBox="0 0 127.14 96.36"
</main> ><path
fill="currentColor"
d="M107.7 8.07A105.15 105.15 0 0 0 81.47 0a72.06 72.06 0 0 0-3.36 6.83 97.68 97.68 0 0 0-29.11 0A72.37 72.37 0 0 0 45.64 0a105.89 105.89 0 0 0-26.25 8.09C2.79 32.65-1.71 56.6.54 80.21a105.73 105.73 0 0 0 32.17 16.15 77.7 77.7 0 0 0 6.89-11.11 68.42 68.42 0 0 1-10.85-5.18c.91-.66 1.8-1.34 2.66-2a75.57 75.57 0 0 0 64.32 0c.87.71 1.76 1.39 2.66 2a68.68 68.68 0 0 1-10.87 5.19 77 77 0 0 0 6.89 11.1 105.25 105.25 0 0 0 32.19-16.14c2.64-27.38-4.51-51.11-18.9-72.15ZM42.45 65.69C36.18 65.69 31 60 31 53s5-12.74 11.43-12.74S54 46 53.89 53s-5.05 12.69-11.44 12.69Zm42.24 0C78.41 65.69 73.25 60 73.25 53s5-12.74 11.44-12.74S96.23 46 96.12 53s-5.04 12.69-11.43 12.69Z"
></path></svg
>
</a>
</section>
</section>
</main>
<a href="https://astro.build/blog/astro-5/" id="news" class="box"> <a href="https://astro.build/blog/astro-5/" id="news" class="box">
<svg width="32" height="32" fill="none" xmlns="http://www.w3.org/2000/svg" <svg width="32" height="32" fill="none" xmlns="http://www.w3.org/2000/svg"
><path ><path
d="M24.667 12c1.333 1.414 2 3.192 2 5.334 0 4.62-4.934 5.7-7.334 12C18.444 28.567 18 27.456 18 26c0-4.642 6.667-7.053 6.667-14Zm-5.334-5.333c1.6 1.65 2.4 3.43 2.4 5.333 0 6.602-8.06 7.59-6.4 17.334C13.111 27.787 12 25.564 12 22.666c0-4.434 7.333-8 7.333-16Zm-6-5.333C15.111 3.555 16 5.556 16 7.333c0 8.333-11.333 10.962-5.333 22-3.488-.774-6-4-6-8 0-8.667 8.666-10 8.666-20Z" d="M24.667 12c1.333 1.414 2 3.192 2 5.334 0 4.62-4.934 5.7-7.334 12C18.444 28.567 18 27.456 18 26c0-4.642 6.667-7.053 6.667-14Zm-5.334-5.333c1.6 1.65 2.4 3.43 2.4 5.333 0 6.602-8.06 7.59-6.4 17.334C13.111 27.787 12 25.564 12 22.666c0-4.434 7.333-8 7.333-16Zm-6-5.333C15.111 3.555 16 5.556 16 7.333c0 8.333-11.333 10.962-5.333 22-3.488-.774-6-4-6-8 0-8.667 8.666-10 8.666-20Z"
fill="#111827"></path></svg fill="#111827"></path></svg
> >
<h2>What's New in Astro 5.0?</h2> <h2>What's New in Astro 5.0?</h2>
<p> <p>
From content layers to server islands, click to learn more about the new features and From content layers to server islands, click to learn more about the new
improvements in Astro 5.0 features and improvements in Astro 5.0
</p> </p>
</a> </a>
</div> </div>
<style> <style>
#background { #background {
position: fixed; position: fixed;
top: 0; top: 0;
left: 0; left: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
z-index: -1; z-index: -1;
filter: blur(100px); filter: blur(100px);
} }
#container { #container {
font-family: Inter, Roboto, 'Helvetica Neue', 'Arial Nova', 'Nimbus Sans', Arial, sans-serif; font-family:
height: 100%; Inter, Roboto, "Helvetica Neue", "Arial Nova", "Nimbus Sans", Arial,
} sans-serif;
height: 100%;
}
main { main {
height: 100%; height: 100%;
display: flex; display: flex;
justify-content: center; justify-content: center;
} }
#hero { #hero {
display: flex; display: flex;
align-items: start; align-items: start;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
padding: 16px; padding: 16px;
} }
h1 { h1 {
font-size: 22px; font-size: 22px;
margin-top: 0.25em; margin-top: 0.25em;
} }
#links { #links {
display: flex; display: flex;
gap: 16px; gap: 16px;
} }
#links a { #links a {
display: flex; display: flex;
align-items: center; align-items: center;
padding: 10px 12px; padding: 10px 12px;
color: #111827; color: #111827;
text-decoration: none; text-decoration: none;
transition: color 0.2s; transition: color 0.2s;
} }
#links a:hover { #links a:hover {
color: rgb(78, 80, 86); color: rgb(78, 80, 86);
} }
#links a svg { #links a svg {
height: 1em; height: 1em;
margin-left: 8px; margin-left: 8px;
} }
#links a.button { #links a.button {
color: white; color: white;
background: linear-gradient(83.21deg, #3245ff 0%, #bc52ee 100%); background: linear-gradient(83.21deg, #3245ff 0%, #bc52ee 100%);
box-shadow: box-shadow:
inset 0 0 0 1px rgba(255, 255, 255, 0.12), inset 0 0 0 1px rgba(255, 255, 255, 0.12),
inset 0 -2px 0 rgba(0, 0, 0, 0.24); inset 0 -2px 0 rgba(0, 0, 0, 0.24);
border-radius: 10px; border-radius: 10px;
} }
#links a.button:hover { #links a.button:hover {
color: rgb(230, 230, 230); color: rgb(230, 230, 230);
box-shadow: none; box-shadow: none;
} }
pre { pre {
font-family: font-family:
ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', ui-monospace, "Cascadia Code", "Source Code Pro", Menlo, Consolas,
monospace; "DejaVu Sans Mono", monospace;
font-weight: normal; font-weight: normal;
background: linear-gradient(14deg, #d83333 0%, #f041ff 100%); background: linear-gradient(14deg, #d83333 0%, #f041ff 100%);
-webkit-background-clip: text; -webkit-background-clip: text;
-webkit-text-fill-color: transparent; -webkit-text-fill-color: transparent;
background-clip: text; background-clip: text;
margin: 0; margin: 0;
} }
h2 { h2 {
margin: 0 0 1em; margin: 0 0 1em;
font-weight: normal; font-weight: normal;
color: #111827; color: #111827;
font-size: 20px; font-size: 20px;
} }
p { p {
color: #4b5563; color: #4b5563;
font-size: 16px; font-size: 16px;
line-height: 24px; line-height: 24px;
letter-spacing: -0.006em; letter-spacing: -0.006em;
margin: 0; margin: 0;
} }
code { code {
display: inline-block; display: inline-block;
background: background:
linear-gradient(66.77deg, #f3cddd 0%, #f5cee7 100%) padding-box, linear-gradient(66.77deg, #f3cddd 0%, #f5cee7 100%) padding-box,
linear-gradient(155deg, #d83333 0%, #f041ff 18%, #f5cee7 45%) border-box; linear-gradient(155deg, #d83333 0%, #f041ff 18%, #f5cee7 45%) border-box;
border-radius: 8px; border-radius: 8px;
border: 1px solid transparent; border: 1px solid transparent;
padding: 6px 8px; padding: 6px 8px;
} }
.box { .box {
padding: 16px; padding: 16px;
background: rgba(255, 255, 255, 1); background: rgba(255, 255, 255, 1);
border-radius: 16px; border-radius: 16px;
border: 1px solid white; border: 1px solid white;
} }
#news { #news {
position: absolute; position: absolute;
bottom: 16px; bottom: 16px;
right: 16px; right: 16px;
max-width: 300px; max-width: 300px;
text-decoration: none; text-decoration: none;
transition: background 0.2s; transition: background 0.2s;
backdrop-filter: blur(50px); backdrop-filter: blur(50px);
} }
#news:hover { #news:hover {
background: rgba(255, 255, 255, 0.55); background: rgba(255, 255, 255, 0.55);
} }
@media screen and (max-height: 368px) { @media screen and (max-height: 368px) {
#news { #news {
display: none; display: none;
} }
} }
@media screen and (max-width: 768px) { @media screen and (max-width: 768px) {
#container { #container {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
#hero { #hero {
display: block; display: block;
padding-top: 10%; padding-top: 10%;
} }
#links { #links {
flex-wrap: wrap; flex-wrap: wrap;
} }
#links a.button { #links a.button {
padding: 14px 18px; padding: 14px 18px;
} }
#news { #news {
right: 16px; right: 16px;
left: 16px; left: 16px;
bottom: 2.5rem; bottom: 2.5rem;
max-width: 100%; max-width: 100%;
} }
h1 { h1 {
line-height: 1.5; line-height: 1.5;
} }
} }
</style> </style>

View file

@ -1,23 +1,23 @@
<!doctype html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width" /> <meta name="viewport" content="width=device-width" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" /> <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<link rel="icon" href="/favicon.ico" /> <link rel="icon" href="/favicon.ico" />
<meta name="generator" content={Astro.generator} /> <meta name="generator" content={Astro.generator} />
<title>Astro Basics</title> <title>dnsc.io</title>
</head> </head>
<body> <body>
<slot /> <slot />
</body> </body>
</html> </html>
<style> <style>
html, html,
body { body {
margin: 0; margin: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
</style> </style>

View file

@ -7,5 +7,5 @@ import Layout from "../layouts/Layout.astro";
--- ---
<Layout> <Layout>
<Welcome /> <Welcome />
</Layout> </Layout>

View file

@ -1,5 +1,5 @@
{ {
"extends": "astro/tsconfigs/strict", "extends": "astro/tsconfigs/strict",
"include": [".astro/types.d.ts", "**/*"], "include": [".astro/types.d.ts", "**/*"],
"exclude": ["dist"] "exclude": ["dist"]
} }