Skip to content

Commit

Permalink
non-ts-file.md updated
Browse files Browse the repository at this point in the history
  • Loading branch information
Sejal99 committed Oct 26, 2023
1 parent 53d9a7a commit 097e343
Showing 1 changed file with 18 additions and 1 deletion.
19 changes: 18 additions & 1 deletion docs/basic/troubleshooting/non-ts-files.md
Original file line number Diff line number Diff line change
Expand Up @@ -20,13 +20,30 @@ Likewise if you wish to "import" an image or other non TS/TSX file:

```ts
// declaration.d.ts

declare module "*.png" {
const value: any; // Adjust the type based on your use case
export = value;
}
// anywhere in your project, NOT the same name as any of your .ts/tsx files
declare module "*.png";
import * as React from 'react';

// importing in a tsx file
import * as logo from "./logo.png";
```
const MyComponent: React.FC = () => {
return (
<div>
<img src={logo} alt="Logo" />
<p>{window.MyVendorThing}</p>
</div>
);
};

Note that `tsc` cannot bundle these files for you, you will have to use Webpack or Parcel.



Related issue: https://github.com/Microsoft/TypeScript-React-Starter/issues/12 and [StackOverflow](https://stackoverflow.com/a/49715468/4216035)


0 comments on commit 097e343

Please sign in to comment.