在webpack项目中正确导入LZString

Question

我正在尝试将LZString 1.4.4 导入我的webpack项目,但是我在chrome console中遇到了这个错误:

core.es5.js?de3d:1020 ERROR TypeError: Cannot read property 'compress' of undefined
at FileReader.reader.onload (file-upload.ts?e535:117)
at ZoneDelegate.invoke (zone.js?6524:392)
at Object.onInvoke (core.es5.js?de3d:3890)
at ZoneDelegate.invoke (zone.js?6524:391)
at Zone.runGuarded (zone.js?6524:155)
at FileReader.eval (zone.js?6524:133)

我这样导入LZString:

import { LZString } from 'lz-string';

并且使用LZString的代码是这样的:

private compressAndChangeModel(file:File){
    let reader:FileReader = new FileReader();
    reader.onload = () => {
        let compressed:string=LZString.compress(reader.result);
        this.modelChange.next(compressed);
    };
    reader.onerror = (error) => {
        console.log('Error when trying to generate base64: ', error);
    };
    reader.readAsDataURL(file);
}

如何在我的webpack项目中导入LZString的正确方法？

Answer 1

LZString不会导出名为的属性LZString.您可以使用合成默认导入import LZString from 'lz-string';.

但是,compress导出,所以你可以使用import { compress } from 'lz-string',只需使用compress().

如果您不喜欢通用compress名称,您也可以使用别名来import { compress as lzStringCompress } from 'lz-string';替换它.