webpack cant find module

Question

I am trying to resolve problem with webpack configuration. Its my webpack.config.js file:

var webpack = require('webpack');
const path = require('path');

var config = {
   entry: {
        app: "./app/app.js"
    },
    output: {
        path: __dirname + '/dist',
        filename: '[name].bundle.js',
    },
    module: {
        rules: [
            {
                test: /\.js$/,
                use: [{
                    loader: 'babel-loader',
                    options: {presets: ['es2015']}
                }]
            }
        ]
    }
};

module.exports = config;

My app.js file:

import {test} from './testModule';

test();

and testModule.js file:

export function test() {
    console.log(5)
}

I bundle project by command >webpack --config webpack.config.js

It runs without any errors, however when i open index.html file where app.bundle.js file is attached i get error in console:

Uncaught Error: Cannot find module "testModule"
at Object.<anonymous> (app.bundle.js:75)
at __webpack_require__ (app.bundle.js:20)
at Object.defineProperty.value (app.bundle.js:66)
at app.bundle.js:69

I havent found any correct solution to solve my problem. Any ideas ?

Answer 1

Your testModule.js is not a module because it does not have any import statement so it is not considered a module, even though you are exporting something. Hence webpack complains. Also, your app.js is not exporting anything, so there is nothing you can import from app.js