fix(website): better image format

This commit is contained in:
OLIMINATOR 2023-04-09 22:00:25 +02:00
parent 44aa5961bc
commit 78778d1a4a
5 changed files with 93 additions and 53 deletions

View file

@ -1,46 +1,37 @@
import path from "path"; import path from "path";
import { fileURLToPath } from "url"; import { fileURLToPath } from "url";
import { defineConfig } from "astro/config"; import { defineConfig } from "astro/config";
import sitemap from "@astrojs/sitemap"; import sitemap from "@astrojs/sitemap";
import robotsTxt from "astro-robots-txt"; import robotsTxt from "astro-robots-txt";
import compress from "astro-compress"; import compress from "astro-compress";
import tailwind from "@astrojs/tailwind"; import tailwind from "@astrojs/tailwind";
import { CONFIG } from "./src/config"; import { CONFIG } from "./src/config";
import image from "@astrojs/image";
const __dirname = path.dirname(fileURLToPath(import.meta.url)); const __dirname = path.dirname(fileURLToPath(import.meta.url));
// https://astro.build/config
export default defineConfig({ export default defineConfig({
site: CONFIG.origin, site: CONFIG.origin,
base: "/", base: "/",
trailingSlash: "always", trailingSlash: "always",
output: "static", output: "static",
integrations: [ integrations: [sitemap(), robotsTxt({
sitemap(), policy: [{
robotsTxt({ userAgent: "*"
policy: [ }],
{ sitemap: true
userAgent: "*", }), compress({
}, css: true,
], html: true,
sitemap: true, img: true,
}), js: true,
compress({ svg: true
css: true, }), tailwind(), image()],
html: true, vite: {
img: true, resolve: {
js: true, alias: {
svg: true, "~": path.resolve(__dirname, "./src")
}), }
tailwind(), }
], }
vite: { });
resolve: {
alias: {
"~": path.resolve(__dirname, "./src"),
},
},
},
});

View file

@ -9,11 +9,12 @@
"astro": "astro" "astro": "astro"
}, },
"dependencies": { "dependencies": {
"@astrojs/image": "^0.16.5",
"@astrojs/prefetch": "^0.2.1", "@astrojs/prefetch": "^0.2.1",
"@astrojs/sitemap": "^1.2.1", "@astrojs/sitemap": "^1.2.1",
"@astrojs/tailwind": "^3.1.1", "@astrojs/tailwind": "^3.1.1",
"@tailwindcss/typography": "^0.5.9", "@tailwindcss/typography": "^0.5.9",
"astro": "^2.1.9", "astro": "^2.2.1",
"astro-compress": "^1.1.35", "astro-compress": "^1.1.35",
"astro-google-fonts-optimizer": "^0.2.2", "astro-google-fonts-optimizer": "^0.2.2",
"astro-icon": "^0.8.0", "astro-icon": "^0.8.0",

Binary file not shown.

After

Width:  |  Height:  |  Size: 200 KiB

View file

@ -2,6 +2,8 @@
import Layout from "~/layouts/Layout.astro"; import Layout from "~/layouts/Layout.astro";
import Invite from "~/components/Invite.astro"; import Invite from "~/components/Invite.astro";
import Computer from "~/components/Computer.astro"; import Computer from "~/components/Computer.astro";
import { Image, Picture } from "@astrojs/image/components";
import Logo from "~/assets/logo.png";
--- ---
<Layout> <Layout>
@ -9,9 +11,12 @@ import Computer from "~/components/Computer.astro";
<div <div
class="flex flex-col items-center px-4 text-center md:flex-row md:text-left" class="flex flex-col items-center px-4 text-center md:flex-row md:text-left"
> >
<img <Image
src="https://raw.githubusercontent.com/Hyro-Blobs/blobs/main/other/hyro_santa_bucket.png" src={Logo}
alt="" alt="Roles Bot Logo"
format="webp"
width={512}
height={512}
class="mb-6 h-48 w-48 rounded-full md:h-64 md:w-64" class="mb-6 h-48 w-48 rounded-full md:h-64 md:w-64"
/> />
<div> <div>

View file

@ -29,6 +29,9 @@ importers:
apps/website: apps/website:
dependencies: dependencies:
'@astrojs/image':
specifier: ^0.16.5
version: 0.16.5(astro@2.2.1)
'@astrojs/prefetch': '@astrojs/prefetch':
specifier: ^0.2.1 specifier: ^0.2.1
version: 0.2.1 version: 0.2.1
@ -37,13 +40,13 @@ importers:
version: 1.2.1 version: 1.2.1
'@astrojs/tailwind': '@astrojs/tailwind':
specifier: ^3.1.1 specifier: ^3.1.1
version: 3.1.1(astro@2.1.9)(tailwindcss@3.3.1) version: 3.1.1(astro@2.2.1)(tailwindcss@3.3.1)
'@tailwindcss/typography': '@tailwindcss/typography':
specifier: ^0.5.9 specifier: ^0.5.9
version: 0.5.9(tailwindcss@3.3.1) version: 0.5.9(tailwindcss@3.3.1)
astro: astro:
specifier: ^2.1.9 specifier: ^2.2.1
version: 2.1.9 version: 2.2.1
astro-compress: astro-compress:
specifier: ^1.1.35 specifier: ^1.1.35
version: 1.1.35 version: 1.1.35
@ -165,6 +168,10 @@ importers:
packages: packages:
/@altano/tiny-async-pool@1.0.2:
resolution: {integrity: sha512-qQzaI0TBUPdpjZ3qo5b2ziQY9MSNpbziH2ZrE5lvtUZL+kn9GwVuVJwoOubaoNkeDB+rqEefnpu1k+oMpOCYiw==}
dev: false
/@ampproject/remapping@2.2.0: /@ampproject/remapping@2.2.0:
resolution: {integrity: sha512-qRmjj8nj9qmLTQXXmaR1cck3UXSRMPrbsLJAasZpF+t3riI71BXed5ebIOYwQntykeZuhjsdweEc9BxH5Jc26w==} resolution: {integrity: sha512-qRmjj8nj9qmLTQXXmaR1cck3UXSRMPrbsLJAasZpF+t3riI71BXed5ebIOYwQntykeZuhjsdweEc9BxH5Jc26w==}
engines: {node: '>=6.0.0'} engines: {node: '>=6.0.0'}
@ -178,6 +185,29 @@ packages:
/@astrojs/compiler@1.3.0: /@astrojs/compiler@1.3.0:
resolution: {integrity: sha512-VxSj3gh/UTB/27rkRCT7SvyGjWtuxUO7Jf7QqDduch7j/gr/uA5P/Q5I/4zIIrZjy2yQAKyKLoox2QI2mM/BSA==} resolution: {integrity: sha512-VxSj3gh/UTB/27rkRCT7SvyGjWtuxUO7Jf7QqDduch7j/gr/uA5P/Q5I/4zIIrZjy2yQAKyKLoox2QI2mM/BSA==}
dev: true
/@astrojs/compiler@1.3.1:
resolution: {integrity: sha512-xV/3r+Hrfpr4ECfJjRjeaMkJvU73KiOADowHjhkqidfNPVAWPzbqw1KePXuMK1TjzMvoAVE7E163oqfH3lDwSw==}
dev: false
/@astrojs/image@0.16.5(astro@2.2.1):
resolution: {integrity: sha512-pps2fXTcPqUJOaATgrXT2eQwYJeW2fmd+QuQLqBiiIQHaECNugHCt/MwBi9skn+195VcFtYM3eCTjvmRrx4fPQ==}
peerDependencies:
astro: ^2.2.0
sharp: '>=0.31.0'
peerDependenciesMeta:
sharp:
optional: true
dependencies:
'@altano/tiny-async-pool': 1.0.2
astro: 2.2.1
http-cache-semantics: 4.1.1
image-size: 1.0.2
kleur: 4.1.5
magic-string: 0.27.0
mime: 3.0.0
dev: false
/@astrojs/language-server@0.28.3: /@astrojs/language-server@0.28.3:
resolution: {integrity: sha512-fPovAX/X46eE2w03jNRMpQ7W9m2mAvNt4Ay65lD9wl1Z5vIQYxlg7Enp9qP225muTr4jSVB5QiLumFJmZMAaVA==} resolution: {integrity: sha512-fPovAX/X46eE2w03jNRMpQ7W9m2mAvNt4Ay65lD9wl1Z5vIQYxlg7Enp9qP225muTr4jSVB5QiLumFJmZMAaVA==}
@ -197,13 +227,13 @@ packages:
vscode-uri: 3.0.7 vscode-uri: 3.0.7
dev: false dev: false
/@astrojs/markdown-remark@2.1.2(astro@2.1.9): /@astrojs/markdown-remark@2.1.3(astro@2.2.1):
resolution: {integrity: sha512-rYkmFEv2w7oEk6ZPgxHkhWzwcxSUGc1vJU0cbCu5sHF8iFNnc1cmMsjXWa5DrU5sCEf8VVYE1iFlbbnFzvHQJw==} resolution: {integrity: sha512-Di8Qbit9p7L7eqKklAJmiW9nVD+XMsNHpaNzCLduWjOonDu9fVgEzdjeDrTVCDtgrvkfhpAekuNXrp5+w4F91g==}
peerDependencies: peerDependencies:
astro: ^2.1.5 astro: ^2.2.0
dependencies: dependencies:
'@astrojs/prism': 2.1.1 '@astrojs/prism': 2.1.1
astro: 2.1.9 astro: 2.2.1
github-slugger: 1.5.0 github-slugger: 1.5.0
import-meta-resolve: 2.2.2 import-meta-resolve: 2.2.2
rehype-raw: 6.1.1 rehype-raw: 6.1.1
@ -240,14 +270,14 @@ packages:
zod: 3.21.4 zod: 3.21.4
dev: false dev: false
/@astrojs/tailwind@3.1.1(astro@2.1.9)(tailwindcss@3.3.1): /@astrojs/tailwind@3.1.1(astro@2.2.1)(tailwindcss@3.3.1):
resolution: {integrity: sha512-Wx/ZtVnmtfqHWGVzvUEYZm8rufVKVgDIef0q6fzwUxoT1EpTTwBkTbpnzooogewMLOh2eTscasGe3Ih2HC1wVA==} resolution: {integrity: sha512-Wx/ZtVnmtfqHWGVzvUEYZm8rufVKVgDIef0q6fzwUxoT1EpTTwBkTbpnzooogewMLOh2eTscasGe3Ih2HC1wVA==}
peerDependencies: peerDependencies:
astro: ^2.1.3 astro: ^2.1.3
tailwindcss: ^3.0.24 tailwindcss: ^3.0.24
dependencies: dependencies:
'@proload/core': 0.3.3 '@proload/core': 0.3.3
astro: 2.1.9 astro: 2.2.1
autoprefixer: 10.4.14(postcss@8.4.21) autoprefixer: 10.4.14(postcss@8.4.21)
postcss: 8.4.21 postcss: 8.4.21
postcss-load-config: 4.0.1(postcss@8.4.21) postcss-load-config: 4.0.1(postcss@8.4.21)
@ -1879,8 +1909,8 @@ packages:
zod: 3.21.4 zod: 3.21.4
dev: false dev: false
/astro@2.1.9: /astro@2.2.1:
resolution: {integrity: sha512-UkbG0lgue1b/t4yMI+AkAGEfdOwcPS2RUYQ/QIurtKjP6W5gtKQveRTBuHH7iwiBziH+z8Ecc5/OAALoXSvMlQ==} resolution: {integrity: sha512-yYPRzh3su38bi3VBCKmYAUBkQSaFQMKFsu8JAVDzFRoGLbskJ/6JkDX2abSB9/iRug8GAKaH/FWxXOTzIsSQ7Q==}
engines: {node: '>=16.12.0', npm: '>=6.14.0'} engines: {node: '>=16.12.0', npm: '>=6.14.0'}
hasBin: true hasBin: true
peerDependencies: peerDependencies:
@ -1889,9 +1919,9 @@ packages:
sharp: sharp:
optional: true optional: true
dependencies: dependencies:
'@astrojs/compiler': 1.3.0 '@astrojs/compiler': 1.3.1
'@astrojs/language-server': 0.28.3 '@astrojs/language-server': 0.28.3
'@astrojs/markdown-remark': 2.1.2(astro@2.1.9) '@astrojs/markdown-remark': 2.1.3(astro@2.2.1)
'@astrojs/telemetry': 2.1.0 '@astrojs/telemetry': 2.1.0
'@astrojs/webapi': 2.1.0 '@astrojs/webapi': 2.1.0
'@babel/core': 7.21.4 '@babel/core': 7.21.4
@ -4050,7 +4080,6 @@ packages:
/http-cache-semantics@4.1.1: /http-cache-semantics@4.1.1:
resolution: {integrity: sha512-er295DKPVsV82j5kw1Gjt+ADA/XYHsajl82cGNQG2eyoPkvgUhX+nDIyelzhIWbbsXP39EHcI6l5tYs2FYqYXQ==} resolution: {integrity: sha512-er295DKPVsV82j5kw1Gjt+ADA/XYHsajl82cGNQG2eyoPkvgUhX+nDIyelzhIWbbsXP39EHcI6l5tYs2FYqYXQ==}
dev: true
/human-signals@2.1.0: /human-signals@2.1.0:
resolution: {integrity: sha512-B4FFZ6q/T2jhhksgkbEW3HBvWIfDW85snkQgawt07S7J5QXTk6BkNV+0yAeZrM5QpMAdYlocGoljn0sJ/WQkFw==} resolution: {integrity: sha512-B4FFZ6q/T2jhhksgkbEW3HBvWIfDW85snkQgawt07S7J5QXTk6BkNV+0yAeZrM5QpMAdYlocGoljn0sJ/WQkFw==}
@ -4075,6 +4104,14 @@ packages:
engines: {node: '>= 4'} engines: {node: '>= 4'}
dev: true dev: true
/image-size@1.0.2:
resolution: {integrity: sha512-xfOoWjceHntRb3qFCrh5ZFORYH8XCdYpASltMhZ/Q0KZiOwjdE/Yl2QCiWdwD+lygV5bMCvauzgu5PxBX/Yerg==}
engines: {node: '>=14.0.0'}
hasBin: true
dependencies:
queue: 6.0.2
dev: false
/import-fresh@3.3.0: /import-fresh@3.3.0:
resolution: {integrity: sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==} resolution: {integrity: sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==}
engines: {node: '>=6'} engines: {node: '>=6'}
@ -6443,6 +6480,12 @@ packages:
/queue-microtask@1.2.3: /queue-microtask@1.2.3:
resolution: {integrity: sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==} resolution: {integrity: sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==}
/queue@6.0.2:
resolution: {integrity: sha512-iHZWu+q3IdFZFX36ro/lKBkSvfkztY5Y7HMiPlOUjhupPcG2JMfst2KKEpu5XndviX/3UhFbRngUPNKtgvtZiA==}
dependencies:
inherits: 2.0.4
dev: false
/quick-format-unescaped@4.0.4: /quick-format-unescaped@4.0.4:
resolution: {integrity: sha512-tYC1Q1hgyRuHgloV/YXs2w15unPVh8qfu/qCTfhTYamaw7fyhumKa2yGpdSo87vY32rIclj+4fWYQXUMs9EHvg==} resolution: {integrity: sha512-tYC1Q1hgyRuHgloV/YXs2w15unPVh8qfu/qCTfhTYamaw7fyhumKa2yGpdSo87vY32rIclj+4fWYQXUMs9EHvg==}
dev: false dev: false