From cd2b9dc76a4844c8d9895fdcf2a229d7d84cadab Mon Sep 17 00:00:00 2001 From: Chung-il Jung Date: Sun, 28 Jul 2024 20:58:31 +0900 Subject: [PATCH] @fepack/image --- package.json | 1 + pnpm-lock.yaml | 7 +++++++ src/App.tsx | 11 +++++++++++ 3 files changed, 19 insertions(+) diff --git a/package.json b/package.json index d7549dd..a583af6 100644 --- a/package.json +++ b/package.json @@ -6,6 +6,7 @@ "license": "MIT", "dependencies": { "@emotion/react": "^11.13.0", + "@fepack/image": "^0.2.6", "react": "^18.3.1", "react-dom": "^18.3.1", "react-router-dom": "^6.25.1" diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index d4aeb0c..a47d9a7 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -8,6 +8,9 @@ dependencies: '@emotion/react': specifier: ^11.13.0 version: 11.13.0(@types/react@18.3.3)(react@18.3.1) + '@fepack/image': + specifier: ^0.2.6 + version: 0.2.6 react: specifier: ^18.3.1 version: 18.3.1 @@ -612,6 +615,10 @@ packages: engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} dev: true + /@fepack/image@0.2.6: + resolution: {integrity: sha512-z1KXZGr9jDz/adgy1xgKt6EBTAFtEKsjMqc3OFVsBeUwSx+SrlobtonNG068bmZkXkI02t454cgxwAFCa2I9XQ==} + dev: false + /@humanwhocodes/config-array@0.11.14: resolution: {integrity: sha512-3T8LkOmg45BV5FICb15QQMsyUSWrQ8AygVfC7ZG32zOalnqrilm018ZVCw0eapXux8FtA33q8PSRSstjee3jSg==} engines: {node: '>=10.10.0'} diff --git a/src/App.tsx b/src/App.tsx index 28665ea..33100c2 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -8,6 +8,7 @@ import { Logo } from './components'; import { ROUTES } from './constants'; import { End, Home, Mode, Play, Ready } from './pages'; import { GlobalStyle } from './styles/GlobalStyle'; +import { load, checkWebPSupport } from '@fepack/image'; const router = createBrowserRouter([ { path: ROUTES.HOME, element: }, @@ -18,6 +19,16 @@ const router = createBrowserRouter([ { path: '*', element: }, ]); +const checkWebPSupportAndLoad = async () => { + if (await checkWebPSupport()) { + load('images/information_resize.webp'); + load('images/options_resize.webp'); + load('images/boxing-gloves_resize.webp'); + } +}; + +checkWebPSupportAndLoad(); + const App = () => ( <>