Реагировать Не могу импортировать изображения ни в один компонент

Question

Начиная с моего webpack.config:

---

{
   test: /\.(jpg|png)$/,
   use:{
          loader: "file-loader",
          options: {},
   },
},

И в любом из моих компонентов:

---

import img from'../images/test.png';

Понятия не имею, почему это происходит. Я использовал этот загрузчик несколько раз, но я никогда не сталкивался с этой проблемой. В момент, когда я включаю .png изображение, я получаю следующее сообщение об ошибке:

_react-setup / dist / app / images / test.png: 1 (функция (экспорт, требуется, модуль, __filename, __dirname) { PNG ^

SyntaxError: неверный или неожиданный токен

Я не делаю ничего сумасшедшего. Просто небольшой узел сервера, реагируйте, реагируйте dom и styled-компоненты.

Кто-нибудь знает, что происходит и как это решить? Я также пытался поместить изображения в другой каталог, но ничего не помогло.

Заранее спасибо

Полный webpack.config

const path = require('path');

module.exports = {
  entry: './src/client/index.jsx',
  output: {
    filename: 'dist/public/bundle.js',
  },
  resolve: {
    extensions: ['.js', '.jsx', '.json'],
  },

  module: {
    rules: [
      {
        test: /\.jsx$/,
        include: [
          path.resolve(__dirname, 'src')
        ],
        exclude: [
          path.resolve(__dirname, 'node_modules')
        ],
        loader: "babel-loader",
        options: {
          presets: ["es2015", "react", "stage-2"],
        }
      },
      {
        test: /\.(png|jpg|gif)$/,
        use: [
          {
            loader: 'file-loader',
            options: {}
          }
        ]
      },
    ]
  },
}