如何使用angular-cli将Cropper.js用于Angular2项目?

时间:2017-01-24 23:51:50

标签: angular typescript angular-cli cropper

我想使用cropper.js(https://github.com/fengyuanchen/cropperjs)创建一个带有angular-cli的Angular2裁剪器。

我的指示是:<​​/ p>

import {Directive, ElementRef, Input, OnInit} from '@angular/core';
import Cropper from 'cropperjs';

@Directive({
  selector: '[ng2-cropper]'
})
export class Ng2CropperJsDirective implements OnInit {
  @Input('options') options: any = {};
  private cropper;
  constructor(private _element: ElementRef) { }

  ngOnInit(): void {
    console.log(Cropper);
    this.cropper = new Cropper(this._element.nativeElement, this.options);
  }
}

ng serve的错误是:Cannot find module 'cropperjs'

但是cropperjs位于node_modules,我的angular-cli.json更新为:

"scripts": [
   "../node_modules/cropperjs/dist/cropper.js"
],

我没有任何想法来解决这个问题。

1 个答案:

答案 0 :(得分:7)

我不认为剪草机有打字 所以当你做import Cropper from 'cropperjs';它不起作用时

简单的解决方案是在typings.d.ts add

declare var Cropper: any;

它会让typscript与cropper一起工作为动态

删除您拥有的导入

正确的解决方案是导入install typings

npm install --save @types/cropperjs