我有一个困难的时间试图得到lodash模块导入。我已经使用npm+gulp设置了我的项目,并不断撞击相同的墙。我试过普通的lodash,也试过lodash。

lodash npm包:(在包根文件夹中有一个index.js文件)

import * as _ from 'lodash';    

结果:

error TS2307: Cannot find module 'lodash'.

lodash-es npm包:(在lodash.js的包根文件夹中有一个默认的导出)

import * as _ from 'lodash-es/lodash';

结果:

error TS2307: Cannot find module 'lodash-es'.   

gulp任务和webstorm都报告了相同的问题。

有趣的是,这没有返回错误:

import 'lodash-es/lodash';

... 但是当然没有“_”…

我的tsconfig。json文件:

{
  "compilerOptions": {
    "target": "es5",
    "module": "system",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false
  },
  "exclude": [
    "node_modules"
  ]
}

我的gulpfile.js:

var gulp = require('gulp'),
    ts = require('gulp-typescript'),
    uglify = require('gulp-uglify'),
    sourcemaps = require('gulp-sourcemaps'),
    tsPath = 'app/**/*.ts';

gulp.task('ts', function () {
    var tscConfig = require('./tsconfig.json');
    
    gulp.src([tsPath])
        .pipe(sourcemaps.init())
        .pipe(ts(tscConfig.compilerOptions))
        .pipe(sourcemaps.write('./../js'));
});

gulp.task('watch', function() {
    gulp.watch([tsPath], ['ts']);
});

gulp.task('default', ['ts', 'watch']);

如果我理解正确,我的tsconfig中的modulerresolution:'node'应该将import语句指向node_modules文件夹,其中安装了lodash和lodash-es。我还尝试了许多不同的导入方法:绝对路径、相对路径,但似乎都不起作用。什么好主意吗?

如果有必要,我可以提供一个小zip文件来说明这个问题。


当前回答

如果其他人遇到这个问题,并且由于“重复标识符”问题,上述解决方案都不起作用,运行这个:

npm install typings --global

对于旧版本的类型,事情会变得混乱,你会得到一堆“重复标识符”的问题。你也不需要再使用环境,就我所知。

因此,一旦类型是最新的,这应该可以工作(使用Angular 2快速入门)。

Run:

npm install lodash --save 
typings install lodash --save

首先,将它添加到systemjs.config.js:

'lodash':                     'node_modules/lodash/lodash.js'

现在你可以在任何文件中使用它:import * as _ from 'lodash';

如果你仍然有问题,删除你的typings文件夹并运行npm install。

其他回答

如果其他人遇到这个问题,并且由于“重复标识符”问题,上述解决方案都不起作用,运行这个:

npm install typings --global

对于旧版本的类型,事情会变得混乱,你会得到一堆“重复标识符”的问题。你也不需要再使用环境,就我所知。

因此,一旦类型是最新的,这应该可以工作(使用Angular 2快速入门)。

Run:

npm install lodash --save 
typings install lodash --save

首先,将它添加到systemjs.config.js:

'lodash':                     'node_modules/lodash/lodash.js'

现在你可以在任何文件中使用它:import * as _ from 'lodash';

如果你仍然有问题,删除你的typings文件夹并运行npm install。

从lodash部分导入应该在angular 4.1中工作。X使用以下符号:

let assign = require('lodash/assign');

或者使用'lodash-es'并在module中导入:

import { assign } from 'lodash-es';

我成功地在我的项目中导入了lodash,使用以下命令:

npm install lodash --save
typings install lodash --save

然后我导入它的方式如下:

Import * as _ from 'lodash';

在systemjs.config.js中我定义了这个:

地图:“lodashs: node_modules/lodash/lodash。”

如果不工作后

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

您尝试这样做并导入lodash

typings install lodash --save

请注意npm install——save将在生产代码中培养应用程序所需的任何依赖关系。 至于“类型”,它只被TypeScript要求,而TypeScript最终会转译成JavaScript。因此,您可能不希望在生产代码中使用它们。我建议把它放在项目的devDependencies中,使用

npm install --save-dev @types/lodash

or

npm install -D @types/lodash

(参见Akash的帖子)。顺便说一下,ng2 tuto就是这么做的。

或者,以下是你的包装方式。Json可以是这样的:

{
    "name": "my-project-name",
    "version": "my-project-version",
    "scripts": {whatever scripts you need: start, lite, ...},
    // here comes the interesting part
    "dependencies": {
       "lodash": "^4.17.2"
    }
    "devDependencies": {
        "@types/lodash": "^4.14.40"
    }
}

只是一个小提示

npm的好处是,如果你不确定你正在寻找的依赖项的最新可用版本,你可以先简单地执行npm install——save或——save-dev,它会自动在你的包中为你设置。Json供进一步使用。