diff --git a/README.md b/README.md index 1db9e5a..482336a 100644 --- a/README.md +++ b/README.md @@ -52,6 +52,10 @@ type AnyFunction // simply declared any function ``` +```typescript +// images like GIF, JPG, JPEG, PNG, BMP, WEBP as string module +``` + ## Why it comes for? The inspiration of this package is built for practical uses when often occurred. @@ -145,6 +149,20 @@ function FunctionStyleComponent({ It should be useful when you make a component with '[Styled Components](https://styled-components.com/)' | '[Emotion Styled](https://emotion.sh/docs/styled)' +And also you can use your image components like below with '[React](https://react.dev/)'! + +```typescript jsx +// import with no errors! +import sampleImage from '~/statics/sample-image.gif'; + +// just use that image! +function SomeImageElement(): ReactElement { + return ; +} + +export default SomeImageElement; +``` + The package includes example `JS-Doc`. This package will promise to you below. diff --git a/index.d.ts b/index.d.ts index 7f31b60..d20f564 100644 --- a/index.d.ts +++ b/index.d.ts @@ -45,3 +45,57 @@ declare type PropsWithClassName< * } */ declare type AnyFunction = (...args: any[]) => any + +/** Image File Format GIF + * + * @example + * import example from '~/statics/example.gif'; + */ +declare module '*.gif' { + export default string +} + +/** Image File Format JPG + * + * @example + * import example from '~/statics/example.jpg'; + */ +declare module '*.jpg' { + export default string +} + +/** Image File Format JPEG + * + * @example + * import example from '~/statics/example.jpeg'; + */ +declare module '*.jpeg' { + export default string +} + +/** Image File Format PNG + * + * @example + * import example from '~/statics/example.png'; + */ +declare module '*.png' { + export default string +} + +/** Image File Format BMP + * + * @example + * import example from '~/statics/example.bmp'; + */ +declare module '*.bmp' { + export default string +} + +/** Image File Format WEBP + * + * @example + * import example from '~/statics/example.webp'; + */ +declare module '*.webp' { + export default string +} \ No newline at end of file diff --git a/package.json b/package.json index 20c1455..1cc3301 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@oshx/type-helper", - "version": "1.0.6", + "version": "1.0.7", "description": "Types help TypeScript types.", "repository": { "type": "git",