打字稿你导入`lodash` - 与`es2015`模块？

Question

它曾经可以工作，但现在我将我的项目更改为 ionic2@RC.0，并使用其新的 rollup 和 es2015 捆绑/模块。我无法正确获取lodash。

lodash在那里，但是在错误的地方——我需要的方法在_.default

npm 步骤

npm install lodash --save
npm install @types/lodash --save-dev --save-exact

javascript

import * as _ from "lodash";
console.log( Object.keys(_) )    // ["default", "__moduleExports"]
console.log(_.default.VERSION)   // 4.16.2

发生了什么事？

更新

import _ from "lodash";  // imports as lodash, not _

// Chrome debugger console:
console.log(_)      // VM2037:1 Uncaught ReferenceError: _ is not defined(…)
console.log(lodash) // function
console.log(Object.keys(lodash))  // returns: VM2075:1 ["templateSettings", "after", "ary", "assign", ...]

更新 2

也许这与 Chrome 调试器 + 汇总有关？我将我的代码更改为import _ from "lodash";，它工作正常——除了在调试器控制台中......

    console.log(">>> _.keys(_): " + _.keys(_).slice(10, 20));
    // >>> _.keys(_): bindAll,bindKey,castArray,chain,chunk,compact,concat,cond,conforms,constant
    // and the _.sortBy() below works fine
    var sorted = _.sortBy(photos, function (o) {
        return o[sort.key];
    });

   // BUT, in the Chrome debugger (at breakpoint)
   console.log(_)      // VM2037:1 Uncaught ReferenceError: _ is not defined(…)

事实上，当我查看main.js 而不是源映射时，我看到了摇树的迹象（？）：

        console.log(">>> _.keys(_): " + lodash.keys(lodash).slice(10, 20));
        var sorted = lodash.sortBy(photos, function (o) {
            return o[sort.key];
        });

我的问题似乎出在 Chrome 调试控制台上，但我不知道如何解决它...

Answer 1

问题是您在导入中使用了import * as。这不会选择默认值。

使用将导入默认值的语法：

import _ from "lodash"

Here is a link to the documentation

似乎 rollup 尝试使用静态导入来摇树捆绑包。因此，它也需要一个 lodash 依赖项，即 ES6。尝试安装 lodash-es 包，然后导入它：

import _ from "lodash-es"