-1

I keep getting the following error when setting up webpack for my project. I already had my project built before webpack and I am just now setting it up so I can uglify my project. So excuse my ignorance on this.

ERROR in ./client/src/index.js
Module parse failed: Unexpected token (42:2)
You may need an appropriate loader to handle this file type.
ReactDOM.render(
<Provider store={store}>
<Router history={hist}>
<div>

webpack.config.js

const path = require("path");
const HtmlWebpackPlugin = require("html-webpack-plugin");
module.exports = {
  entry: "./client/src/index.js",
  output: {
    path: path.join(__dirname, "/dist"),
    filename: "bundle.js"
  },
  resolve: {
    extensions: [".js", ".jsx"]
  },
  watch: true,
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        test: /\.(sa|sc|c)ss$/,
        use: ["style-loader", "css-loader", "sass-loader"],
        use: {
          loader: "babel-loader"
        }
      }
    ],
    loaders: [
      {
        test: /\.(js|jsx)$/,
        exclude: /node_modules/,
        loader: "babel-loader",
        options: { presets: ["es2015", "react"] },
        include: [path.resolve(__dirname, "client")]
      }
    ]
  },
  plugins: [
    new HtmlWebpackPlugin({
      template: "./src/public/index.html"
    })
  ]
};

Edit in my index.js, I tried the suggested answer

ReactDOM.render(
  React.createElement(
    <Provider store={store}>

.babelrc

{
  "presets": ["es2015", "env", "react"],
  "plugins": [
    "transform-class-properties",
    "transform-react-jsx",
    "transform-object-rest-spread",
    [
      "module-resolver",
      {
        "root": ["./src"]
      }
    ],
    ["import-rename", { "^(.*)\\.jsx$": "$1" }]
  ]
}
Snoopy
  • 1,257
  • 2
  • 19
  • 32

1 Answers1

0

In a jsx/tsx file react elements is converted to by the jsx compiler

ReactDom.render(React.createElement(

but as your index file is a .js file you need to do this manually.

For more explanation please follow this link https://reactjs.org/docs/react-without-jsx.html

Apoorva Jhanwer
  • 86
  • 5