環境

仮想環境のOS：Ubuntu
webpack 4.19.1

エラー内容

ERROR in ./src/main.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
Error: Plugin/Preset files are not allowed to export objects, only functions. In /home/vagrant/React_study/React入門/Reactのツールで自動ビルド/hello/node_modules/babel-preset-es2015/lib/index.js
    at createDescriptor (/home/vagrant/React_study/React入門/Reactのツールで自動ビルド/hello/node_modules/@babel/core/lib/config/config-descriptors.js:178:11)

エラーが出てしまうファイル

エラーが出るwebpack設定ファイルです

module.exports = {
  entry: './src/main.js',
  output: {
    filename: './src/out/bundle.js'
  },
  module: {
    rules: [
      {
        test: /.js$/,
        loader: 'babel-loader',
        options: {
          presets:['es2015', 'react']
        }
      }
    ]
  }
};

test:ではjsファイルを指定。optionsでは、babel-loaderのオプションとしてes2015とreactを指定しReact/JSX変換を行う。

しかし、エラーが出てしまう。es2015古いんかなぁ、、、

解決方法 :

調べてみると、足りないパッケージをインストールする必要があるようだ。

npm i @babel/preset-env

インストールが始まった。
そして、上の方に書いたwebpackの設定ファイルを修正した。
['es2015','react']から、['@babel/env', '@babel/react']に修正した

module.exports = {
  entry: './src/main.js',
  output: {
    filename: './src/out/bundle.js'
  },
  module: {
    rules: [
      {
        test: /.js$/,
        loader: 'babel-loader',
        options: {
          presets:['@babel/env', '@babel/react'] //['es2015','react']から変更
        }
      }
    ]
  }
};

結果 :

無事に、一つのファイルとして生成されたファイルが生成された