parcel - Typescript - Hvordan kan jeg importere png-filer inn i TypeScript-filen min?

Jeg satte opp mitt eget TypeScript-prosjekt med Parcel-kompilatoren og fikk alt til å kjøre på den innebygde serveren. Jeg implementerte pixi.js og ønsket å importere .png-filer inn i .ts-filene mine. Men når jeg prøver å importere, sier den at den ikke finner modulen, selv om begge filene er i samme mappe? Hva mangler jeg?

Jeg prøvde å gjøre følgende

npm install @types/node --save-dev

tsconfig.json (plassert i rotmappen min)

{
  "compilerOptions": {
    "types": ["node"],
    "typeRoots": ["node_modules/@types"]
  }
}

Svar #1

Så vidt jeg kan gjette ut fra ditt gitte eksempel, har dette ingenting å gjøre med Parcel.

Parcel v1 vil internt kjøre tsc og kompilatoren vil enkelt gi en feil for ukjente filutvidelser som .png, fordi rene TS-prosjekter kun vil kunne importere kodefiler (.js, .ts, .tsx, .jsx eller .json) uten en modulbunter som Parcel eller Webpack involvert.

Bundlers lar deg importere andre filtyper ved å konvertere dem til gyldige moduler som kan brukes i prosjektet ditt (implementert av loaders i Webpack, Parcel håndterer det enda mer transparent).

For å "overbevise" kompilatoren om at denne typen importer er greit og for å gjøre modulen kjent, kan jokertegn-moduldeklarasjoner brukes. For eksempel, for å få .png-filimporter til å kompilere, lager du en fil globals.d.ts eller lignende med følgende deklarasjon:

declare module '*.png';

Det burde allerede være nok til å tilfredsstille kompilatoren (her er et Parcel-spesifikt relatert problem).

Håper det hjelper.