'Cannot resolve load path in webpack

I try to migrate gulp+browserify to webpack and I have problems resolving path.

Here is my project tree :

/path/to/project
├── webpack.config.js
└── www/static
        ├── build
        │   ├── js
        │   │   ├── main.js <-------│ Output wanted
        │   │   └── main.js.map <---│
        ├── js
        │   ├── app.js
        │   ├── contact.js
        │   ├── device.js
        │   └── ...
        └── sass
            ├── main.scss
            └── partials
                ├── _helpers.scss
                ├── _mixins.scss
                └── _variables.scss

And here is my config file :

var path = require('path');

module.exports = {
    entry: { 'app': 'app.js' },

    resolve: {
        modulesDirectories: ['www/static/js/', './']
    },

    output: {
        filename: './www/static/build/js/main.js'
    },
    module: {
        loaders: []
    }
};

app.js content for testing purpose :

var $ = require('jquery'),
    Device = require('device'),
    Ga = require('ga');

require('jquery.raty');
require('jquery.autoNumeric');
require('jquery.unveil');

function initialize() {}

module.exports = {
    initialize: initialize,
};

And when I launch webpack I got the error with webpack --display-error-details :

ERROR in Entry module not found: Error: Can't resolve 'app' in '/path/to/project'
resolve 'app' in '/path/to/project'
  Parsed request is a module
  No description file found
  resolve as module
    /Users/jordid/MAWork/MA_vagrant/apps/node_modules doesn't exist or is not a directory
    /Users/jordid/MAWork/MA_vagrant/node_modules doesn't exist or is not a directory
    /Users/jordid/MAWork/node_modules doesn't exist or is not a directory
    /Users/jordid/node_modules doesn't exist or is not a directory
    /Users/node_modules doesn't exist or is not a directory
    /node_modules doesn't exist or is not a directory
    looking for modules in /path/to/project/node_modules
      No description file found
      No description file found
      as directory
        /path/to/project/node_modules/app doesn't exist
      no extension
        /path/to/project/node_modules/app doesn't exist
      .js
        /path/to/project/node_modules/app.js doesn't exist
      .json
        /path/to/project/node_modules/app.json doesn't exist

I don't understand why web pack search only in node_modules folder and not in 'www/static/js/' folder.

For information, I will have multiple entries, but for now I just want webpack works.

Thanks for help.

webpack

Solution 1:^[1]

According to webpack docs modulesDirectories should be an array of directory names. NOT paths.

For example, if the value is ["mydir"], webpack will look in “./mydir”, “../mydir”, “../../mydir”, etc.

Solution 2:^[2]

Got it.

I must use context option :

entry: { 'app': 'app.js' },

resolve: {
    modulesDirectories: ['www/static/js/', './']
},

replaced by :

entry: { 'app' : './app.js' },
context: path.resolve(__dirname, './www/static/js/'),

Solution 3:^[3]

I don't think context is the correct way to handle this.

I would just make the path to my entry file absolute and forget resolve.modulesDirecories

But that's just me.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1	Strelok
Solution 2	JiDai
Solution 3	Craig McKenna

'Cannot resolve load path in webpack

Solution 1:[1]

Solution 2:[2]

Solution 3:[3]

Sources

Related Questions

Solution 1:^[1]

Solution 2:^[2]

Solution 3:^[3]