I have no idea what is wrong
webpack.config.js
const path = require("path");
const webpack = require("webpack");
module.exports = {
entry: "./src/index.js",
output: {
path: path.resolve(__dirname, "./static/frontend"),
filename: "[name].js",
},
module: {
rules: [
{
test: /\.js$/,
exclude: "/node_modules/",
use: {
loader: "babel-loader",
},
},
],
},
optimization: {
minimize: true,
},
plugins: [
new webpack.DefinePlugin({
"process.env": {
// This has effect on the react lib size
NODE_ENV: JSON.stringify("production"),
},
}),
],
};
app.js
import React, { Component } from "react";
import { render } from "react-dom";
export default class App extends Component {
constructor(props) {
super(props);
}
render() {
return (<h1>Testing React Code</h1>);
}
}
const appDiv = document.getElementById("app");
render(<App />, appDiv);
Error
> frontend@1.0.0 dev C:\Users\Administrator\PycharmProjects\pythonProject2\webProject\frontend
> webpack --mode development --watch
asset main.js 4.71 KiB [compared for emit] (name: main)
runtime modules 937 bytes 4 modules
cacheable modules 370 bytes
./src/index.js 37 bytes [built] [code generated]
./src/components/App.js 333 bytes [built] [code generated] [1 error]
ERROR in ./src/components/App.js 11:15
Module parse failed: Unexpected token (11:15)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See
https://webpack.js.org/concepts#loaders
|
| render() {
> return Testing React Code;
| }
| }
@ ./src/index.js 1:0-35
webpack 5.64.0 compiled with 1 error in 201 ms
Babel.config.json
{
"presets": [
[
"@babel/preset-env",
{
"targets": {
"node": "10"
}
}
],
"@babel/preset-react"
],
"plugins": ["@babel/plugin-proposal-class-properties"]
}