
Package.json
{
"name": "frontend",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start",
"lint": "next lint"
},
"dependencies": {
"bootstrap": "^5.1.3",
"isomorphic-fetch": "^3.0.0",
"next": "12.0.7",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"reactstrap": "^9.0.1",
"babel-minify-webpack-plugin": "^0.3.0",
"extract-text-webpack-plugin": "^3.0.2",
"install": "^0.10.4",
"npm": "^5.6.0"
},
"devDependencies": {
"@babel/preset-react": "^7.16.7",
"eslint": "8.6.0",
"eslint-config-next": "12.0.7",
"babel-core": "^6.26.0",
"babel-loader": "^7.1.3",
"babel-preset-es2015": "^6.24.1",
"css-loader": "^0.28.10",
"style-loader": "^0.20.2",
"webpack": "^4.0.0"
}
}
Your console output indicates that Webpack doesn't understand some file type you are trying to use in your app. A typical webpack.config.js can look like this:
module.exports = {
module: {
rules: [
{
test: /\.jsx/,
loader: "babel-loader",
},
],
},
}
This tells Webpack to handle .jsx-files with the "babel-loader" loader.
It looks like you have forgot to supply a loader for the file type you have used on SigninComponent.