Search code examples
angulartypescriptionic3signaturepad

TypeError: __WEBPACK_IMPORTED_MODULE_1_signature_pad__ is not a constructor


I am trying to use angular2-signature-pad library for signature input in my angular project. I have tried using the library as follows:

// in .module.ts file
import {SignaturePadModule} from "angular2-signature-pad";
@NgModule({
  declarations: [
    AddProgressNotePage,
  ],
  imports: [
    IonicPageModule.forChild(AddProgressNotePage),
    SignaturePadModule // Signature Module
  ]
})

// in .ts file   
  import 'signature_pad';

   // in .html file
   <ion-row>
    <signature-pad 
        (onSave)="onSaveHandler($event)" 
        (onClear)="onClearHandler()" 
        [width]="width" 
        [height]="height" 
        [hideFooter]="noFooter" 
        [label]="label">
    </signature-pad>
   </ion-row>

But i got the following error: Error: Uncaught (in promise): TypeError: WEBPACK_IMPORTED_MODULE_1_signature_pad is not a constructor. enter image description here

I saw another SO question in this link and installed below package

npm install --save @types/signature_pad

But the same error happened again. Which part am i missing to work signature pad perfectly?


Solution

  • angular2-signature-pad library is for angular2 and works good with angular cli, Ionic uses a different webpack approach and this lib does not support that.

    So, I am using another module called angular2-signaturepad to make that work.