Error: Duplicate plugin/preset detected.

Bug Report

Current Behavior

ERROR in ./js/index.js Module build failed (from ./node_modules/babel-loader/lib/index.js): Error: Duplicate plugin/preset detected. If you’d like to use two separate instances of a plugin,
they need separate names, e.g.

plugins: [
[‘some-plugin’, {}],
[‘some-plugin’, {}, ‘some unique name’],
]

My webpack.prod.js

var HtmlWebpackPlugin = require('html-webpack-plugin');

var config = {
	
	mode: 'production',
	target: 'electron-main',
	entry: './js/index.js',

	output: {
		path: __dirname + '/interface_build/prod',
		publicPath: './',
		filename: 'app.js'
	},

	module: {
		rules: [
			{
				test: /\.js$/,
				loader: 'babel-loader',
				options: {
					babelrc: true,
					presets: ['@babel/preset-env', '@babel/preset-react'],
				},
				exclude: /node_modules/,
				include: __dirname
			},
			{
				test: /\.scss$/,
				use: [
					'style-loader',
					'css-loader',
					'sass-loader'
				],
				include: __dirname
			},
			{
				test: /\.css$/,
				use: [
					'style-loader',
					'css-loader'
				],
				include: __dirname
			},
			{
				test: /\.(jpe?g|png|gif|svg)$/i,
				use: [
					{
						loader: 'url-loader',
						options: { limit: 10000 }
					},
					{
						loader: 'img-loader',
						options: { progressive: true }
					}
				],
				// loader: 'url-loader?limit=10000!img?progressive=true',
				include: __dirname
			},
			{
				test: /\.(woff|woff2|eot|ttf|otf)$/i,
				loader: 'file-loader',
				include: __dirname
			}
		]
	},
	plugins: [
		new HtmlWebpackPlugin({
			template: 'index.template.ejs',
			filename: 'index.html',
		}),
		new HtmlWebpackPlugin({
			template: 'splash.template.ejs',
			filename: 'splash.html',
			inject: false
		}),
		new HtmlWebpackPlugin({
			template: 'cpu.template.ejs',
			filename: 'cpu.html',
			inject: false
		})]
};


module.exports = config;

My My webpack.dev.js

var HtmlWebpackPlugin = require('html-webpack-plugin');

var config = {
	watch: true,
	mode: 'development',
	target: 'electron-main',
	entry: './js/index.js',
	devServer: {
		historyApiFallback: true,
		compress: true,
		hot: true
	},

	output: {
		path: __dirname + '/interface_build/dev',
		publicPath: './',
		filename: 'app.js'
	},

	module: {
		rules: [
			{
				test: /\.js$/,
				loader: 'babel-loader',
				options: {
				  babelrc: false,
				  presets: ['@babel/preset-env', '@babel/preset-react'],
				},
				exclude: /node_modules/,
				include: __dirname
			},
			{
				test: /\.scss$/,
				use: [
					'style-loader',
					'css-loader',
					'sass-loader'
				],
				include: __dirname
			},
			{
				test: /\.css$/,
				use: [
					'style-loader',
					'css-loader'
				],
				include: __dirname
			},
			{
				test: /\.(jpe?g|png|gif|svg)$/i,
				use: [
					{
						loader: 'url-loader',
						options: { limit: 10000 }
					},
					{
						loader: 'img-loader',
						options: { progressive: true }
					}
				],
				// loader: 'url-loader?limit=10000!img?progressive=true',
				include: __dirname
			},
			{
				test: /\.(woff|woff2|eot|ttf|otf)$/i,
				loader: 'file-loader',
				include: __dirname
			}
		]
	},
	plugins: [
		new HtmlWebpackPlugin({
			template: 'index.template.ejs',
			filename: 'index.html',
		}),
		new HtmlWebpackPlugin({
			template: 'splash.template.ejs',
			filename: 'splash.html',
			inject: false
		}),
		new HtmlWebpackPlugin({
			template: 'cpu.template.ejs',
			filename: 'cpu.html',
			inject: false
		})
	]
};


module.exports = config;

Expected behavior/code A clear and concise description of what you expected to happen (or code).

Babel Configuration (.babelrc, package.json, cli command)

{
	"passPerPreset": true,
	"presets": [
		"@babel/preset-env",
		"@babel/preset-react"
	],
	"env": {
		"development": {
			"presets": [
				"react-optimize"
			],
		},
		"production": {
			
			"plugins": [
				"transform-react-constant-elements",
				"transform-react-inline-elements",
				"transform-react-remove-prop-types",
				"transform-react-pure-class-to-function"
			]
		},
		"test": {
			"plugins": [
				"istanbul"
			]
		}
	},
	"plugins": [
		"transform-class-properties",
		"transform-object-rest-spread"
	]
}

Environment

• Babel version(s): v6.23.0
• Node/npm version: Node v11.13.0 / npm v6.9.0
• OS: Windows 10
• Monorepo: no
• How you are using Babel: loader

Possible Solution

Additional context/Screenshots Add any other context about the problem here. If applicable, add screenshots to help explain.

[burakkp]

Ok, so it’s working now?

Yes man, Thank you.

[nicolo-ribaudo]

You have the env and react presets both in the webpack config and in .babelrc: when the configs are merged, the presets are duplicated.

Also, you are mixing Babel 6 and Babel 7 packages: it will probably cause problems.