如何在打字稿模块化项目中使用cropper.js？答案

【问题标题】：How to use cropper.js in typescript modular project?如何在打字稿模块化项目中使用cropper.js？
【发布时间】：2015-11-23 06:35:34
【问题描述】：

我正在使用 jspm install npm:cropper

安装cropper并将 "cropper": "npm:cropper@^2.0.1" 添加到 package.json 因为我可以在 \jspm_packages\npm 文件夹下找到它

但它没有加载到网络标签中。知道缺少什么吗？

P.S:- 我没有找到cropper.js 的类型定义，所以我已经声明了cropper

declare var cropper: any;
declare module "cropper" {
    export = cropper;
}

并将其作为 import * ascropper from 'cropper' 导入；这没有给出任何错误，但裁剪器加载仍然没有运气。

【问题讨论】：

你有没有想过这个问题？我在做：导入 * 作为 Cropper 'cropper/dist/cropper.min.js'；但我不能这样做：new Cropper(..);它说：Cropper 不是函数
没关系，我进口的是cropper，不是cropperjs

【解决方案1】：

有两个步骤。第一步是安装cropper，这是您将软件包添加到package.json 时所做的。第二步是实际加载包 - 请参阅 https://github.com/systemjs/systemjs 怎么做。

如果你想自己导入包，你不应该使用import ... from 'cropper'but

var cropper = require('cropper');

因为否则 TypeScript 编译器将检查模块是否用 TypeScript 编写，以及它是否位于 node_packages 文件夹下。

【讨论】：

使用 var cropper = System.import("cropper");确实加载cropper.js 要求由于某种原因不起作用。
是的，require 在 commonjs 中使用。（它也可以与 systemjs 一起使用：github.com/systemjs/systemjs/blob/master/docs/…）但 System.import('cropper') 是 systemjs 的正确方法
我有完全相同的问题，但无法解决。我像这样导入并且文件确实被下载了，但是我不能调用 new Cropper(...); ----------> import * as Cropper from 'cropper/dist/cropper.min.js';

【解决方案2】：

但它没有加载到网络标签中。知道缺少什么

它不会被加载除非它需要。例如

var foo = require('cropper');
console.log(foo);

【讨论】：