Collectives™ on Stack Overflow

Find centralized, trusted content and collaborate around the technologies you use most.

Learn more about Collectives

Teams

Q&A for work

Connect and share knowledge within a single location that is structured and easy to search.

Learn more about Teams

I'm stuck and looking for help.

I'm not sure where the problem actually is but I hope to find the answer. 🙂

Problem details

I've installed '@types/lodash' using following command:

npm install --save-dev @types/lodash

And imported lodash in my .ts file using:

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

When I run webpack I get following error:

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

Then I tried to get more details with

webpack --display-error-details

and got ⇣

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

Setup details

package.json (w/o some irrelevant info)

"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'

Environment details

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

Project at the moment when problem occurred: https://github.com/MiroslavJelaska/connect-four/tree/4941ca792096602831940f76fa350e461808a8c5

⬆️ Update #1

Installing lodash to dependencies instead of devDependencies doesn't help:

npm install --save @types/lodash
                Could just be that I've never seen it before, but as far as I know you just install lodash this way (based on what I've seen/done and according to the npm doc on it):  $ npm i -g npm $ npm i --save lodash  Then you'd just import "lodash". What is the purpose of the "@types"? It seems to be throwing off the module resolution in your app.
– Tim Consolazio
                Jan 8, 2017 at 7:25
                @TimConsolazio I've tried to install using --save but it doesn't make a difference. "@types" is prefix of DefinitelyTyped project for TypeScript type definitions. Here is the GitHub repo: github.com/DefinitelyTyped/DefinitelyTyped
– Miro
                Jan 8, 2017 at 7:48
                Have you tried installing it just using the basic command "npm install lodash --save-dev", and then just importing it as-is without the DefinitelyTyped stuff. Maybe the DefinitelyTyped thing (which I know nothing about) is throwing it off. Note that these details (that you are doing something besides the base install) will help, this might actually be a DefinitelyTyped (whatever it is/supposed to do) problem of some kind.
– Tim Consolazio
                Jan 8, 2017 at 7:51
                I just took a look at the .md for the project you indicated. You sure this works in Angular 2? The doc only talks about Angular JS as far as I can see. Searching the entire doc only brings up "Angular JS" it never anywhere says "Angular 2", "Angular2", etc. Sometimes it looks like it might be talking about Angular 2, but it never says it clearly as far as I can tell.
– Tim Consolazio
                Jan 8, 2017 at 7:56

You need the actual lodash package (which contains the JS code that is lodash) and you also need the @types/lodash package, which provides type definitions for the lodash package (essentially, it tells TypeScript what's in the lodash package).

So, you want to run both of these commands to get those two packages:

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

Then in your code, you import it as such:

import * as _ from 'lodash';
_.zip(array1, array1); // or whatever
                So I've run into a similar issue with 'exceljs' I've got both exceljs and @types/exceljs and my import statement is import * as Excel from 'exceljs';, but I still get a Module not found, cannot resolve error...
– Oliver
                Oct 6, 2017 at 12:40
                In addition to JKillians answer you may need to include the following in your tsconfig.      "typeRoots": [       "./node_modules/@types"     ]
– Jeremy
                Jul 1, 2022 at 15:15
        

Thanks for contributing an answer to Stack Overflow!

  • Please be sure to answer the question. Provide details and share your research!

But avoid

  • Asking for help, clarification, or responding to other answers.
  • Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.