找不到模块:错误:无法解析模块'@types/lodash‘

Question

我被困住了，正在寻求帮助。

我不确定问题到底在哪里，但我希望能找到答案。

问题详细信息

我已经使用以下命令安装了'@types/lodash‘：

npm install --save-dev @types/lodash

并使用以下命令在我的.ts文件中导入lodash：

import * as _ from '@types/lodash';

当我运行webpack时，我得到以下错误：

ERROR in ./app/scripts/Components/GameBoard.ts
Module not found: Error: Cannot resolve module '@types/lodash' in /Users/mjelaska/Documents/DevProjects/connect-four/src/app/scripts/Components
 @ ./app/scripts/Components/GameBoard.ts 3:8-32

然后，我尝试通过以下命令获取更多细节

webpack --display-error-details

并得到了⇣

ERROR in ./app/scripts/Components/GameBoard.ts
Module not found: Error: Cannot resolve module '@types/lodash' in /Users/mjelaska/Documents/DevProjects/connect-four/src/app/scripts/Components
resolve module @types/lodash in /Users/mjelaska/Documents/DevProjects/connect-four/src/app/scripts/Components
  looking for modules in /Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules
    resolve 'file' or 'directory' lodash in /Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types
      resolve file
        /Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash.webpack.js doesn't exist
        /Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash is not a file
        /Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash.web.js doesn't exist
        /Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash.ts doesn't exist
        /Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash.js doesn't exist
      resolve directory
        directory default file index
          resolve file index in /Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash
            /Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash/index doesn't exist
            /Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash/index.webpack.js doesn't exist
            /Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash/index.web.js doesn't exist
            /Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash/index.ts doesn't exist
            /Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash/index.js doesn't exist
        use  from package.json
          resolve 'file' or 'directory' /Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash
            resolve file
              /Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash is not a file
              /Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash.webpack.js doesn't exist
              /Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash.web.js doesn't exist
              /Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash.ts doesn't exist
              /Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash.js doesn't exist
            resolve directory
              use  from package.json
                abort resolving because of recursion
              directory default file index
                resolve file index in /Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash
                  /Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash/index doesn't exist
                  /Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash/index.webpack.js doesn't exist
                  /Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash/index.web.js doesn't exist
                  /Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash/index.ts doesn't exist
                  /Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash/index.js doesn't exist
[/Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash.webpack.js]
[/Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash.web.js]
[/Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash.ts]
[/Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash.js]
[/Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash/index]
[/Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash/index.webpack.js]
[/Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash/index.web.js]
[/Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash/index.ts]
[/Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash/index.js]
[/Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash.webpack.js]
[/Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash.web.js]
[/Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash.ts]
[/Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash.js]
[/Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash/index]
[/Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash/index.webpack.js]
[/Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash/index.web.js]
[/Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash/index.ts]
[/Users/mjelaska/Documents/DevProjects/connect-four/src/node_modules/@types/lodash/index.js]
 @ ./app/scripts/Components/GameBoard.ts 3:8-32

设置详细信息

package.json (没有一些不相关的信息)

{
  "devDependencies": {
    "@types/lodash": "^4.14.47",
    "@types/node": "^6.0.55",
    "@types/pixi.js": "^4.3.1",
    "npm": "^4.0.5",
    "ts-loader": "^1.3.3",
    "typescript": "^2.1.4",
    "webpack": "^1.14.0"
  }
}

tsconfig.json

{
    "compilerOptions": {
        "module": "commonjs",
        "target": "es5",
        "noImplicitAny": true,
        "sourceMap": false,
        "removeComments": true,
        "typeRoots": [
          "./node_modules/@types"
        ]
    },
    "files": [
      "./app/scripts/main.ts"
    ]
}

webpack.config.js

module.exports = {
    entry: './app/scripts/main.ts',
    output: {
        filename: './build/scripts/main.js'
    },
    resolve: {
        extensions: ['', '.webpack.js', '.web.js', '.ts', '.js']
    },
    module: {
        loaders: [
            {
                test: /\.ts$/,
                loader: 'ts-loader'
            }
        ]
    }
};

环境详细信息

node: v6.9.4
npm: v4.0.5
webpack: v1.14.0 (as seen in `package.json`, installed also globally)

问题发生时的项目：https://github.com/MiroslavJelaska/connect-four/tree/4941ca792096602831940f76fa350e461808a8c5

⬆️更新#1

将lodash安装到依赖项而不是devDependencies是没有帮助的：

npm install --save @types/lodash

Answer 1

您需要实际的lodash包(其中包含lodash的JS代码)，还需要@types/lodash包，它为lodash包提供类型定义(本质上，它告诉TypeScript lodash包中的内容)。

因此，您想要运行这两个命令来获得这两个包：

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

然后，在您的代码中，按如下方式导入：

import * as _ from 'lodash';

_.zip(array1, array1); // or whatever