如何在Angular / TypeScript项目中使用IScroll

Question

我有一个Angular（Ionic）应用程序，需要在桌面上动量滚动（在Electron内部运行）。

一种可行的方法是使用IScroll，但是我无法加载它。

我已经安装了，所以我的package.json中有以下内容

 "iscroll": "^5.2.0",

，还通过npm install @types/iscroll@5.2.1

安装了输入内容

首先，我无法导入，出现错误[ts] File 'd:/dev/capacitor/electron2/node_modules/@types/iscroll/index.d.ts' is not a module.

然后我尝试将以下内容添加到iscroll/index.d.ts的底部。

export {IScroll};

现在看来已消除了错误。

我现在添加了以下代码：

 public ngAfterViewInit() {
   var wrapper = document.getElementById('wrapper');
   var myScroll = new IScroll(wrapper);
 }

（我知道我应该并会使用@ViewChild()只是试图使其开始工作）

这可以建立，但是当我进入测试页面时，出现以下错误。

        Error: Uncaught (in promise): TypeError: __WEBPACK_IMPORTED_MODULE_3_iscroll__.IScroll is not a constructor
    TypeError: __WEBPACK_IMPORTED_MODULE_3_iscroll__.IScroll is not a constructor
        at ListPage.webpackJsonp.190.ListPage.ngAfterViewInit (http://localhost:8100/build/main.js:114:24)
        at callProviderLifecycles (http://localhost:8100/build/vendor.js:13122:18)

在类型定义中，我们确实有以下内容...

declare class IScroll {
  constructor (element: string, options?: IScrollOptions);
  constructor (element: HTMLElement, options?: IScrollOptions);

有人知道如何使它正常工作吗？

在此先感谢您的帮助！

[UPDATE1] 我的下一个尝试是从类型定义中删除导出，尝试如下进行导入。

import  'iscroll';

该应用程序的构建和运行没有TypeScript错误，直到我们进入实例化IScroll的页面为止，错误现在变为

    Error: Uncaught (in promise): ReferenceError: IScroll is not defined
    ReferenceError: IScroll is not defined
        at ListPage.webpackJsonp.190.ListPage.ngAfterViewInit (http://localhost:8100/build/main.js:116:24)
        at callProviderLifecycles (http://localhost:8100/build/vendor.js:13122:18)

所以，仍然没有地方。

[UPDATE2]

尝试了@Jamshed的建议

 import * as IScroll from 'iscroll'; or
 import IScroll from 'iscroll'; or
 import { IScroll } from 'iscroll'

所有这些都给

[ts] File 'd:/dev/capacitor/electron2/node_modules/@types/iscroll/index.d.ts' is not a module

我确实尝试过添加“旧方法”。

因此我在index.html中添加了

<script src='D:/dev/capacitor/electron2/node_modules/iscroll/build/iscroll-lite.js'></script>

，然后是ts组件文件中的declare var IScroll: any;。

但我再次得到

Error: Uncaught (in promise): ReferenceError: IScroll is not defined
    ReferenceError: IScroll is not defined

在运行时。

[UPDATE3]

我找到了this post，但是如果将他的index.d.ts文件复制到我的文件中，我仍然无法import {IScroll}。我在那里可以看到许多其他出口，但是看不到IScroll ...

Answer 1

我知道，已经过去了 3 年。但我今天遇到了类似的需求，发现了这个：https://www.npmjs.com/package/@types/iscroll

只需将它添加到依赖项，它就会创建一个 Typescript 填充器