Clever Geek Handbook

Input module not found: Error: Unable to resolve './src/index.js'

I installed react launcher app and added webpack but it says that Can't resolve './src/index.js'

.

Browser shows My app gives this look

My files path and package.json content enter image description here

Webpack.config.js Contents

 var debug = process.env.NODE_ENV !== "production";
    var webpack = require('webpack');
    var path = require('path');

    module.exports = {
        context: path.join(__dirname, "public"),
    devtool: debug ? "inline-sourcemap" : false,
    entry: "./src/index.js",
    module: {
        loaders: [
            {
                test: /\.jsx?$/,
                exclude: /(node_modules|bower_components)/,
                loader: 'babel-loader',
                query: {
                    presets: ['react', 'es2016', 'stage-0'],
                    plugins: ['react-html-attrs', 'transform-decorators-legacy', 'transform-class-properties'],
                }
            }
        ]
    },
    output: {
        path: __dirname + "/public/",
        filename: "build.js"
    },
    plugins: debug ? [] : [
        new webpack.optimize.DedupePlugin(),
        new webpack.optimize.OccurrenceOrderPlugin(),
        new webpack.optimize.UglifyJsPlugin({ mangle: false, sourcemap: false }),
    ],
};
+11


source to share


4 answers


Your base URL is path.join(__dirname, "public")

and your entry is ./src/index.js

. Webpack tries to find ./src/index.js

in public

./src/index.js

; obviously it doesn't exist. You must change entry

to ../src/index.js

.



+14


source


Another way to find this problem is to use path.resolve()

.

const path = require('path');
module.exports = {
    mode: "production",
    entry: path.resolve(__dirname, 'src') + 'path/to/your/file.js',
    output: {
        /*Webpack producing results*/
        path: path.resolve(__dirname, "../src/dist"),
        filename: "app-bundle.js"
    }
}


This will make sure webpack is looking for an entry point in the directory src

.

By the way, this is the default entry point. You can also change this entry point to your preferred location. Just replace the directory with src

another directory you want to use.

+1


source


The input path is contextual. It looks for a file in public/src/

if you want it to look for a path only in /src

. Looking at the rest of yours webpack.config.js

, it looks like you don't need the context string.

https://webpack.js.org/configuration/entry-context/

0


source


My webpack.config.js was named Webpack.config.js and a new client was looking for something case sensitive.

0


source






More articles:


All Articles