TypeScript
ย
I made this library so that I can use it in all of my Elysia.js projects without writing the same codes over and over again
ย
- As the name suggests, it is an interface for JSX props holding
children
property - For usage instruction, see
Usage
section
- An interface that extends
JSXChildrenProps
- In addition to
children
property, it holdslang
,desc
,kwd
,title
,icn
properties - This interface is good for HTML meta info
- For usage instruction, see
Usage
section
- This type definition is for JSX Component
- It takes a Generic type as its props type
- Returns a JSX component
- For usage instruction, see
Usage
section
- As the name suggests, this type definition is just like
JSXComponent
but without props - It does not need a Generic type as it has no props
- Returns a JSX component
- For usage instruction, see
Usage
section
ย
- Elysia.js
- Elysia.js HTML
ย
This library is intended to be used in Elysia.js HTML of minimum 1.2.0. It may or may not work on 2.x
- ๐ Minimum elysia Version:
1.2.25
- ๐ Minimum @elysiajs/html Version:
1.2.0
ย
npm add -D @best-skn/elysia-html-types #or yarn add -D @best-skn/elysia-html-types #or pnpm add -D @best-skn/elysia-html-types #or bun add -D @best-skn/elysia-html-types
Create a directory called types
in the root location of your project, and create a file called elysia.d.ts
, then do this
import "@best-skn/elysia-html-types";
Check your tsconfig.json
if includes
property has **/*.ts
, **/*.tsx
or not otherwise the type definition file may not work
import { Html, type JSXChildrenProps, type JSXComponent } from "@elysiajs/html"; const HomeRoute: JSXComponent<JSXChildrenProps> = (props) => { const { children } = props; return ( <div>{children}</div> ); }; export default HomeRoute;
import { Html, type JSXBasicProps, type JSXComponent } from "@elysiajs/html"; const BaseHtml: JSXComponent<JSXBasicProps> = (props) => { const { children, lang, desc, kwd, title, icn } = props; return ( <html lang={lang}> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="description" content={desc ?? "Elysia Web Application"} /> <meta name="keywords" content={kwd ?? "Elysia, Bun, TypeScript"} /> <title>{title ?? "Elysia App"}</title> <link rel="icon" href={icn ?? "/public/icons/logo.svg"} /> </head> <body> <main>{children}</main> </body> </html> ); }; export default BaseHtml;
import { Html, type JSXChildrenProps, type JSXComponent } from "@elysiajs/html"; const HomeRoute: JSXComponent<JSXChildrenProps> = (props) => { const { children } = props; return ( <div>{children}</div> ); }; export default HomeRoute;
import { Html, type JSXComponentNoProps } from "@elysiajs/html"; const HomeRoute: JSXComponentNoProps = () => (<div>Hello from Elysia!</div>); export default HomeRoute;
ย
- ๐ฉโโ๏ธ
Tanjila Hasan Trina
: The long lost love of my life. The course of nature separated us from our paths and put us in separate places far away from each other. But no matter how separated we are right now, each and every moment of mine is only dedicated to you. We may not see each other in this lifetime as it seems but I will find you again in the next life. I just want to say:ไธ็ใฏๆฎ้ ทใ ใใใงใๅใๆใใ
- ๐ฏ
My Parents
: The greatest treasures of my life ever.
ย
Copyright (C) 2024 SKN Shukhan
Licensed under the MIT License