I haven't used Webpack 5 for developing React at the start of my project and want to add it now. My problem is, that I worked with relative paths, which when running Webpack throws me this error message:
Module not found: Error: Can't resolve 'App' in '...Scripts\react\src' Did you mean './App'?
As a solution I could add a './' to all import paths, but that itself would be a huge task I want to avoid.
Another message suggests the following:
If changing the source code is not an option there is also a resolve options called 'preferRelative' which tries to resolve these kind of requests in the current directory too
My question is how and where would I set this 'preferRelative' option? I have now researched for a whole day, but couldn't find any solution for my problem.
This is my webpack.config.js for reference:
const path = require("path");
const WebpackNotifierPlugin = require("webpack-notifier");
const BrowserSyncPlugin = require("browser-sync-webpack-plugin");
module.exports = {
entry: ["babel-polyfill", "./src/index.js"],
output: {
path: path.resolve(__dirname, "./dist"),
filename: "bundle.js",
},
watch: true,
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: "babel-loader",
},
},
],
},
devtool: "inline-source-map",
plugins: [new WebpackNotifierPlugin(), new BrowserSyncPlugin()],
resolve: {
extensions: [".js", ".jsx", ".ts"],
},
};
Your help is very much appreciated!