javascript - 尝试将 SimpleBar 导入 Angular 2 应用程序时，X 不是构造函数

Question

我已经查了好几个小时了，但还是没法让它工作。我想导入 SimpleBar在我的应用程序中，但失败得很惨。

TypeError: simplebar_1.SimpleBar is not a constructor

我今天早些时候设法让 npm 包工作，但是在调整大小时出现了一些奇怪的问题，并且由于 npm 包只附带缩小版本，我求助于“真实的东西”。

我正在尝试将其包装在这样的指令中

import {
    Directive,
    Input,
    ElementRef,
    AfterViewInit
} from '@angular/core';

import { SimpleBar } from 'simplebar';

@Directive({
    selector: '[simpleBar]'
})
export class SimpleBarDirective implements AfterViewInit {
    constructor(private elementRef: ElementRef) { }

    ngAfterViewInit() {
        new SimpleBar(this.elementRef.nativeElement, {
            autoHide: true
        });
    }
};

但是，这给了我上面的错误信息。幸运的是我设法得到了 Plunker启动并运行显示完全相同的错误。

我在这里错过了什么？

Answer 1

问题

在 src/simplebar 中，您通过执行 export default class SimpleBar{....} 将导出声明为默认，然后使用 import {来自 'simplebar' 的 SimpleBar}

您只能通过不带括号的 import SimpleBar from 'simplebar' 来导入默认导出。

当您想从文件中导入多个内容时使用括号导入样式，例如 -

从 'simplethings' 导入 {SimpleBar, SimpleDialog, SimpleModal}

那样的话，文件中将不会有默认导出。

解决方案

使用 import SimpleBar from 'simplebar' 或在 src/simplebar 中的类导出中删除 default 修饰符>