Getting "local module" working in Vite that was working with webpack

Viewed 486

I recently inherited a frontend project with a slow build and replaced react-scripts with Vite. This was more or less pain-free, apart from this Typescript error:

`TS2307: Cannot find module 'app-interfaces' or its corresponding type declarations.`

This app-interfaces module is actually more or less a "path alias" or "local module" or whatever you may call it, that actually references a type definition file under src/bin/models/Interfaces.d.ts (don't ask me about the path - I don't know).

This Interfaces.d.ts file is not imported or referenced anywhere, but it starts like this:

declare module 'app-interfaces' {
  import {
    UserGender,
    SubcriptionPlans,
    SubscriptionPlanInterval,
    EventTypes,
    DayTypes,
    ApiMethods,
    ExerciseTypes,
    SessionTypes,
    EventProps,
  } from './StaticTypes';

  // API
  declare namespace Api {
    export interface Config {
      url: URL;
      options?: {
        method: ApiMethods;
...

Other parts of the code refer to this module like this: import {App, Events, User} from 'app-interfaces';

I cannot actually find any references to how this works at all ... I do not understand how others can reference its types using import {App} from 'app-interfaces'; when nothing ever references the filename, and I tried to eject the app to inspect the webpack config, but I really did not get any smarter ...

Is there a way I can reuse this "trick" of making TSC know about all definitions as app-interfaces in my Vite setup's TS config to avoid redoing all the imports all over the app? The alternative is to replace it with explicit long import paths everywhere (like ../../../src/bin/models/Interfaces.d.ts. While manageable, it's a bit of a chore ...

0 Answers
Related