In order to migrate to Typescript efficiently, and more importantly with open source, iteratively, we need to be able to migrate one to a few js files to ts at a time. Until a JS file is migrated to TS, we need something like the following in place to avoid errors in the files that have been migrated to typescript.

declare module 'scripts/settings/webSettings' {
    export function getPlugins(): Promise<string[]>;
}

The issue with the above declaration is that some files refer to ./scripts/, while others refer to scripts/. To support a typescript migration, we should add an alias to webpack and to tsconfig for our base directories in src/ such as:

"@scripts/*": ["scripts/*"],

The @ serves as a standard indicator to future devs that it is an alias or that, at least, it is not a relative path to the current directory (for components requesting from a subdirectory).

tl;dr:

• Add aliases to typescript & webpack. We can declare the aliases while also not being required to migrate all files to use the aliases at once.
• Configure eslint to understand these aliases. Done via eslint-import-resolver-typescript
• **Use declare module '@alias/.... To help each file we migrate to ts to understand how their imported packages work.

The above will help devs to efficiently and iteratively migrate JS files to typescript.