Invalid module name in augmentation - not able to resolve for progress-bar-webpack-plugin

Question

webpack.config.dev.ts

import * as ProgressBarPlugin from 'progress-bar-webpack-plugin';

Error: Could not find a declaration file for module 'progress-bar-webpack-plugin'

If I try to add a module in a declaration file:

index.d.ts

declare module "progress-bar-webpack-plugin";

Error: Invalid module name in augmentation. Module 'progress-bar-webpack-plugin' resolves to an untyped module at '.../myproject/node_modules/progress-bar-webpack-plugin/index.js', which cannot be augmented.ts(2665)

Answer 1

Imports should be declared inside the module declaration. Example:

declare module 'node-helper-lib' {
   import * as SomeThirdParty from 'node-helper-lib';
   interface Helper {
       new(opt: SomeThirdParty.Options): SomeThirdParty.Type
   }
   export = Helper;
}

Answer 2

Its ok I realised i could install the @types file for this.

yarn add @types/progress-bar-webpack-plugin --save-dev