Angular2不能找到Lodash模块

Question

我很难与导入lodash模块。

我去那个解决方案here但它仍然无法正常工作我仍然有错误“cannon find module”lodash“”。

我试图删除依赖关系，并使用npm install重新安装它，它不会改变任何东西。

​​作品，但import * as _ from "lodash"不.. 我检查和lodash是否安装

这里是我的package.json：

{ 
    "name": "newddeskclient", 
    "version": "0.0.0", 
    "dependencies": { 
    "@angular/common": "2.0.0", 
    "@angular/compiler": "2.0.0", 
    "@angular/core": "2.0.0", 
    "@angular/forms": "2.0.0", 
    "@angular/http": "2.0.0", 
    "@angular/platform-browser": "2.0.0", 
    "@angular/platform-browser-dynamic": "2.0.0", 
    "@angular/platform-server": "2.0.0", 
    "@angular/router": "3.0.0", 
    "@types/node": "^6.0.38", 
    "angular2-datatable": "^0.6.0", 
    "angular2-in-memory-web-api": "0.0.20", 
    "angular2-platform-node": "~2.0.10", 
    "angular2-universal": "~2.0.10", 
    "angular2-universal-polyfills": "~2.0.10", 
    "aspnet-prerendering": "^1.0.6", 
    "aspnet-webpack": "^1.0.11", 
    "bootstrap": "^3.3.7", 
    "core-js": "^2.4.1", 
    "css": "^2.2.1", 
    "css-loader": "^0.25.0", 
    "es6-shim": "^0.35.1", 
    "expose-loader": "^0.7.1", 
    "extract-text-webpack-plugin": "^1.0.1", 
    "file-loader": "^0.9.0", 
    "isomorphic-fetch": "^2.2.1", 
    "jquery": "^2.2.1", 
    "lodash": "^4.17.4", 
    "preboot": "^4.5.2", 
    "raw-loader": "^0.5.1", 
    "reflect-metadata": "^0.1.3", 
    "rxjs": "5.0.0-beta.12", 
    "style-loader": "^0.13.0", 
    "systemjs": "0.19.27", 
    "to-string-loader": "^1.1.5", 
    "ts-loader": "^0.8.2", 
    "typescript": "^2.0.0", 
    "url-loader": "^0.5.7", 
    "webpack": "^1.12.14", 
    "webpack-externals-plugin": "^1.0.0", 
    "webpack-hot-middleware": "^2.10.0", 
    "webpack-merge": "^0.14.1", 
    "zone.js": "^0.6.21" 
    }, 
    "devDependencies": { 
    "@types/lodash": "^4.14.62", 
    "typescript": "^2.0.2", 
    "typings": "^1.3.2", 
    "gulp": "^3.9.1", 
    "path": "^0.12.7", 
    "gulp-clean": "^0.3.2", 
    "gulp-concat": "^2.6.0", 
    "gulp-typescript": "^2.13.6", 
    "gulp-tsc": "^1.2.0" 
    } 
} 

是否有任何解决方案来解决这个问题呢？

[编辑]

这里是我的tsconfig.json：

{ 
    "compilerOptions": { 
    "emitDecoratorMetadata": true, 
    "experimentalDecorators": true, 
    "module": "commonjs", 
    "noEmitOnError": true, 
    "noImplicitAny": false, 
    "outDir": "../Scripts/AppClient", 
    "removeComments": false, 
    "sourceMap": true, 
    "target": "es5", 
    "moduleResolution": "node" 
    }, 
    "exclude": [ 
    "node_modules", 
    "typings/index", 
    "typings/index.d.ts" 
    ] 
} 

Answer 1

确保您通过检查node_modules的lodash文件夹中安装。 然后使用命令

typings install lodash 

Systemjs.config.js安装分型：添加以下项目

map: { 
    'lodash': 'npm:lodash/lodash.js', 

} 

在我的情况

paths: { 
     // paths serve as alias 
     'npm:': 'node_modules/' 
    }, 

的依赖是hammerjs。所以请确保您导入到你的AppModule

Answer 2

这个片段添加到您的角cli.json

"scripts": [ 
     "../node_modules/lodash/lodash.js" //make changes accordingly 
     ], 

在组件，才刚刚导入后部分添加声明部分和正常使用lodash。

declare var _: any; 

Answer 3

我已经试过了，包括lodash到我的项目的几种方法。最简单的一个是导入这样的：

import * as _ from 'lodash/index'; 

（假设你使用@types/lodash你显然做）

这实际上引用node_modules\@types\lodash\index.d.ts文件，该文件需要处理剩下的事情。

编辑：可能还需要

"typeRoots": [ 
    "./node_modules/@types", 
    "./node_modules" 
] 

添加到您的tsconfig.json

Answer 4

的compilerOptions部分安装@types/lodash后，

在types阵列tsconfig.json文件添加lodash进入如图所示下面，你不需要添加任何东西。它应该不需要导入任何东西。

{ 
    "compilerOptions": { "types" : ["node", "lodash"] } 
}