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 files path and package.json content
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 }),
],
};
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
.
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.
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/
My webpack.config.js was named Webpack.config.js and a new client was looking for something case sensitive.