Соответствующая ошибка загрузчика на index.js

Question

Я застрял на этой же ошибке, и мне нужны свежие глаза для помощи .... Я запутался в "соответствующем загрузчике".Я думал, что это из-за неправильного регулярного выражения в файле веб-пакета.Я проверил документы babel и эту проблему для получения рекомендаций.

Это ошибка ...

ОШИБКА в ./src/index.js Не удалось выполнить анализ модуля: неожиданноtoken (6:16)

Вам может понадобиться соответствующий загрузчик для обработки этого типа файлов.

@ multi (webpack) -dev-server / client? http://localhost:8080 ./src

Это мой src / index.js

import React from 'react'
import ReactDOM from 'react-dom'

import App from './Components/App'
ReactDOM.render(<App />, document.getElementById('root'))

.babelrc

{
  "presets": ["env", "react"],
  "env": {
    "development": {
      "plugins": [["react-transform",{
      "transforms": [{
        "transform": "react-transform-hmr",
        "imports": ["react"],
        "locals": ["module"]
      }]
    }]]
    }
  }
}

webpack.dev.config.js

const path = require('path')
const webpack = require('webpack')
const HtmlWebpackPlugin = require('html-webpack-plugin')

module.exports = {
  entry: './src/index.js',
  output: {
    filename: 'bundle.js',
    path: path.resolve(__dirname, 'build'),
    publicPath: '/',
  },
  module: {
    rules: [
      { test: /\.js$/,
        loader: 'babel-loader',
        exclude: /node_modules/,
        include: [path.resolve(__dirname, "src")]
      }
    ],
  },
  devServer: {
    historyApiFallback: true,
    inline: true,
    hot: true,
  },
  plugins: [
    new HtmlWebpackPlugin({template: 'src/index.html'}),
    new webpack.HotModuleReplacementPlugin()
    ],
}

и мой package.json

{
  "name": "webpack-starter-kit",
  "version": "1.0.0",
  "description": "starter files for basic development and production using React, Babel, Webpack",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "webpack-dev-server --progress --mode=development",
    "build": "webpack --mode=production"
  },
  "author": "Kevin Turney",
  "license": "ISC",
  "dependencies": {
    "react": "^16.2.0",
    "react-dom": "^16.2.0",
    "react-router-dom": "^4.2.2"
  },
  "devDependencies": {
    "babel-cli": "^6.26.0",
    "babel-core": "^6.26.0",
    "babel-loader": "^7.1.4",
    "babel-plugin-react-transform": "^3.0.0",
    "babel-preset-env": "^1.6.1",
    "babel-preset-react": "^6.24.1",
    "css-loader": "^0.28.11",
    "extract-text-webpack-plugin": "^3.0.2",
    "file-loader": "^1.1.11",
    "html-webpack-plugin": "^3.0.7",
    "postcss-loader": "^2.1.2",
    "react-transform-hmr": "^1.0.4",
    "style-loader": "^0.20.3",
    "uglifyjs-webpack-plugin": "^1.2.4",
    "webpack": "^4.6.0",
    "webpack-cli": "^2.0.15",
    "webpack-dev-server": "^3.1.1"
  }
}