From 7559469b57721f24768fc49fab023a1ae9f09a38 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Albert=20Juh=C3=A9=20Lluveras?= <contact@albertjuhe.com>
Date: Sat, 14 Aug 2021 18:07:10 +0200
Subject: [PATCH] Update dependencies

---
 .babelrc          |  9 +++++----
 .eslintrc         |  2 +-
 package.json      | 46 +++++++++++++++++++++++-----------------------
 webpack.config.js | 26 ++++++++++++++++----------
 4 files changed, 45 insertions(+), 38 deletions(-)

diff --git a/.babelrc b/.babelrc
index 2d33be8..701fada 100644
--- a/.babelrc
+++ b/.babelrc
@@ -1,6 +1,7 @@
 {
-  "presets": ["env", "react"],
-  "plugins": [
-    "transform-object-rest-spread"
+  "presets": [
+    "@babel/preset-env",
+    "@babel/preset-react",
+    "@babel/preset-typescript"
   ]
-}
+}
\ No newline at end of file
diff --git a/.eslintrc b/.eslintrc
index 534156d..e3c466d 100644
--- a/.eslintrc
+++ b/.eslintrc
@@ -1,6 +1,6 @@
 {
   "extends": "eslint:recommended",
-  "parser": "babel-eslint",
+  "parser": "@babel/eslint-parser",
   "env": {
     "browser": true,
     "node": true,
diff --git a/package.json b/package.json
index 9cf4659..88970e7 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
 	"name": "react-lazy-load-image-component",
 	"version": "1.5.1",
-	"description": " React Component to lazy load images using a HOC to track window scroll position. ",
+	"description": " React Component to lazy load images using a HOC to track window scroll position.",
 	"main": "build/index.js",
 	"peerDependencies": {
 		"react": "^15.x.x || ^16.x.x || ^17.x.x",
@@ -12,30 +12,29 @@
 		"lodash.throttle": "^4.1.1"
 	},
 	"devDependencies": {
-		"babel-cli": "^6.24.1",
-		"babel-core": "^6.26.0",
-		"babel-eslint": "^8.2.2",
-		"babel-jest": "^22.4.1",
-		"babel-loader": "^7.1.4",
-		"babel-plugin-transform-object-rest-spread": "^6.26.0",
-		"babel-preset-env": "^1.6.1",
-		"babel-preset-react": "^6.24.1",
-		"css-loader": "^0.28.10",
-		"enzyme": "^3.4.4",
-		"enzyme-adapter-react-16": "^1.2.0",
-		"eslint": "^4.18.2",
-		"eslint-loader": "^2.0.0",
-		"eslint-plugin-babel": "^4.1.2",
-		"eslint-plugin-react": "^7.11.1",
-		"husky": "^3.1.0",
-		"jest": "^23.5.0",
+		"@babel/core": "^7.15.0",
+		"@babel/eslint-parser": "^7.15.0",
+		"@babel/preset-env": "^7.15.0",
+		"@babel/preset-react": "^7.14.5",
+		"@babel/preset-typescript": "^7.15.0",
+		"babel-jest": "^27.0.6",
+		"babel-loader": "^8.2.2",
+		"css-loader": "^6.2.0",
+		"enzyme": "^3.11.0",
+		"enzyme-adapter-react-16": "^1.15.6",
+		"eslint": "^7.32.0",
+		"eslint-plugin-babel": "^5.3.1",
+		"eslint-plugin-react": "^7.24.0",
+		"eslint-webpack-plugin": "^3.0.1",
+		"husky": "^7.0.1",
+		"jest": "^27.0.6",
 		"path": "^0.12.7",
-		"prettier": "^1.19.1",
+		"prettier": "^2.3.2",
 		"react": "^16.2.0",
 		"react-dom": "^16.2.0",
-		"style-loader": "^0.20.3",
-		"webpack": "^4.17.1",
-		"webpack-cli": "^3.1.2"
+		"style-loader": "^3.2.1",
+		"webpack": "^5.50.0",
+		"webpack-cli": "^4.7.2"
 	},
 	"scripts": {
 		"test": "jest",
@@ -46,7 +45,8 @@
 	},
 	"jest": {
 		"verbose": true,
-		"testURL": "http://localhost/"
+		"testURL": "http://localhost/",
+		"testEnvironment": "jsdom"
 	},
 	"repository": {
 		"type": "git",
diff --git a/webpack.config.js b/webpack.config.js
index 8617b1e..ad88b9f 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -1,5 +1,5 @@
-const webpack = require('webpack');
 const path = require('path');
+const ESLintPlugin = require('eslint-webpack-plugin');
 
 module.exports = {
 	mode: 'production',
@@ -11,13 +11,6 @@ module.exports = {
 	},
 	module: {
 		rules: [
-			{
-				enforce: 'pre',
-				test: /\.jsx?$/,
-				loaders: ['eslint-loader'],
-				include: path.resolve(__dirname, 'src'),
-				exclude: /(node_modules|bower_components|build)/,
-			},
 			{
 				test: /\.jsx?$/,
 				include: path.resolve(__dirname, 'src'),
@@ -25,13 +18,20 @@ module.exports = {
 				use: {
 					loader: 'babel-loader',
 					options: {
-						presets: ['env'],
+						presets: ['@babel/preset-env'],
 					},
 				},
 			},
 			{
 				test: /\.css$/,
-				loaders: ['style-loader', 'css-loader'],
+				use: [
+					{
+						loader: 'style-loader',
+					},
+					{
+						loader: 'css-loader',
+					},
+				],
 				exclude: /node_modules/,
 			},
 		],
@@ -40,4 +40,10 @@ module.exports = {
 		react: 'commonjs react',
 		'react-dom': 'commonjs react-dom',
 	},
+	plugins: [
+		new ESLintPlugin({
+			context: path.resolve(__dirname, 'src'),
+			extensions: ['js', 'jsx', 'ts', 'tsx'],
+		}),
+	],
 };