在 Angular 2 + webpack 项目中从 lodash 导入单个函数答案

【问题标题】：Import single function from lodash in Angular 2 + webpack project在 Angular 2 + webpack 项目中从 lodash 导入单个函数
【发布时间】：2016-11-23 02:35:02
【问题描述】：

一个很常见的问题。

如何从 lodash 导入单个函数？

我试过lodash.orderby，但我相信它应该与commonjs一起使用。我也尝试了lodash-es，但没有取得多大成功。我仍然收到各种错误，例如Cannot find module 'lodash-es' 或Cannot find module 'lodash/orderBy'。

另一种可能是使用custom builds，但我不知道如何正确导入单个函数。

运行 Angular 2 RC-4、typescript 2.1.0-dev、webpack 2（测试版）。

Typescript 的配置方式如下：

{
  "compilerOptions": {
    "target": "es5",
    "module": "es6",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false,
    "moduleResolution": "node"
  },
  "exclude": [
    "node_modules",
    "typings/main",
    "typings/main.d.ts"
  ]
}

更新

我目前正在通过以下方式导入模块：

import {orderBy} from 'lodash-es';

这实际上是有效的（即应用程序正确使用 orderBy），但错误仍然存在。我认为问题在于 lodash-es 没有类型定义。

typings.json

{
  "globalDependencies": {
    "core-js": "registry:dt/core-js#0.0.0+20160602141332",
    "jasmine": "registry:dt/jasmine#2.2.0+20160505161446",
    "jquery": "registry:dt/jquery#1.10.0+20160417213236",
    "node": "registry:dt/node#6.0.0+20160613154055",
    "typeahead": "registry:dt/typeahead#0.11.1+20160317120654"
  },
  "dependencies": {
    "lodash": "registry:npm/lodash#4.0.0+20160416211519"
  }
}

更新：

这是一个老问题，但为了将来参考，如果您不使用require，您可能需要安装正确的打字信息。在这种特殊情况下，我需要安装和声明模块 lodash-es。

【问题讨论】：

typings.json 文件的内容是什么以及如何导入 orderby？
不要导入 lodash.orderby，需要它。
@tomastrajan 我用更多信息更新了我的问题。我认为打字定义不适用于 lodash-es。我包含了 lodash 的定义，这就是您在 typings.json 中看到的内容。
@estus 但我没有使用 commonjs。
@RobertSmith Webpack 可以。

标签： angular webpack lodash

【解决方案1】：

安装所需功能：

npm install --save lodash.countby @types/lodash.countby

然后使用以下命令导入它：

const countBy = require('lodash.countBy');

【讨论】：

这是一个老问题，但据我所知，我没有使用require。问题在于声明正确的类型。
是的，但不幸的是它仍然有效。我花了相当长的时间。由于答案隐藏在对您问题的评论中，因此我通过提交答案使其更加明显。无论如何，这是我找到这样做的唯一方法。
它是有效的，但不适用于这个特定的问题。我将更新问题以描述在这种情况下有效的方法。