无法在网站上显示图像 Webpack React-dom 意外语法

Question

错误信息：

 webpack-dev-server

/home/panecitodigital/Desktop/react-course-projects/cse-app/webpack.config.js:35
  };
   ^

我的webpack.config.js

在我尝试添加文件加载器以处理图像之前，它工作正常，每次我尝试修复错误时，cmd 都会告诉我出现了一个新文件。一个尝试过网络上的解决方案但没有结果的新手。请帮助 :) 当我不是新手时会付钱

const path = require('path');

module.exports = {
  entry: './src/app.js',
  output: {
    path: path.join(__dirname, 'public'),
    filename: 'bundle.js'
  },
  module: {
    rules: [{
      loader: 'babel-loader',
      test: /\.js$/,
      exclude: /node_modules/
    }, {
      test:    /\.s?css$/,
      use: [
        'style-loader',
        'css-loader',
        'sass-loader',
      ]
    },
    {
      test : /\.jpg$/,
      exclude: /(node_modules)/,
      loader : 'file-loader'
    }],
  devtool: 'cheap-module-eval-source-map',
  devServer: {
    contentBase: path.join(__dirname, 'public'),
    historyApiFallback: true,
  }
  };

Answer 1

您在模块中的规则后似乎缺少 }。该错误出现在最后一行，因为它不期望 ; 它期望再 } 关闭整个对象。

const path = require('path');

module.exports = {
  entry: './src/app.js',
  output: {
    path: path.join(__dirname, 'public'),
    filename: 'bundle.js'
  },
  module: {
    rules: [
      {
        loader: 'babel-loader',
        test: /\.js$/,
        exclude: /node_modules/
      },
      {
        test:    /\.s?css$/,
        use: [
          'style-loader',
          'css-loader',
          'sass-loader'
        ]
      },
      {
        test : /\.jpg$/,
        exclude: /(node_modules)/,
        loader : 'file-loader'
      }
    ]
  },   // <---- this is missing
  devtool: 'cheap-module-eval-source-map',
  devServer: {
    contentBase: path.join(__dirname, 'public'),
    historyApiFallback: true,
  }
};

Answer 2

module.exports = {
  entry: './src/app.js',
  output: {
    path: path.join(__dirname, 'public'),
    filename: 'bundle.js'
  },
  devtool: 'cheap-module-eval-source-map',
  devServer: {
    contentBase: path.join(__dirname, 'public'),
    historyApiFallback: true,
  },
  module: {
    rules:[
      {
        loader: 'babel-loader',
        test: /\.js$/,
        exclude: /node_modules/
      }, {
        test:    /\.s?css$/,
        use: [
        'style-loader',
        'css-loader',
        'sass-loader',
        ]
        },
        {
        test : /\.jpg$/,
        exclude: /(node_modules)/,
        loader : 'file-loader'
        }
    ]
  }


};

无法在网站上显示图像 Webpack React-dom 意外语法

Cant display images on website Webpack React-dom unexpected syntax

reactjs

webpack

react-dom