webpack "cannot find module"

Question

Switching from Gulp to Webpack, can't get LESS css to work for some reason

module.exports = {
    entry: {
        web: ['./src/web/ts/index.js']
    },
    output: {
        path: './dev/web/js/',
        filename: 'bundle.js'
    },
    devtool: 'source-map',
    resovle: {
        extensions: ['', '.js'],
        modulesDirectories: ['node_modules']
    },
    module: {
        loaders: [
            {
                test: /\.less$/,
                loaders: ['style', 'css', 'less']
            }
        ]
    }
};

this webpack.config.js seems okay, but the styles inside main.less are not copied to the ./dev folder, nor are they injected into the index.html file (I manually copied the file to the ./dev folder, and it was not modified). I tried

require("./src/web/less/main.less");

that got me a "Unexpected token" error, I tried

require("!style!css!less!./src/web/less/main.less");

that got me a "Cannot find module" error. As I said, removing both I get the bundle.js, but no CSS anywhere.

What's going wrong? Please help!

score 1 · Answer 1 · edited Aug 19 '19 at 13:07

1

Did you forget to npm install css-loader style-loader less-loader?

Seen this issue a few times: webpack error in Cannot find module 'less'.

edited Aug 19 '19 at 13:07

Edgar

6,022
8
33
66

answered Apr 22 '16 at 12:43

Sean Larkin

6,290
1
28
43

score 1 · Answer 2 · answered Nov 30 '17 at 13:38

1

I know this is old, but it might be of help to someone anyway.

There is a typo in your webpack config: resovle -> resolve

answered Nov 30 '17 at 13:38

Trygve

2,445
1
19
23

webpack "cannot find module"

2 Answers2