From 68e1b0332a416b3060d6ae9c31b2a824b26fb866 Mon Sep 17 00:00:00 2001 From: Karl Aleksandrov Date: Sun, 7 Jul 2024 10:03:34 -0700 Subject: [PATCH] feat: modules update (#18) - updated npm dependencies - migrated to eslint 9 --- .eslintignore | 4 - .node-version | 2 +- eslint.config.mjs | 38 +++++++++ package.json | 173 ++++++++++++++++++++-------------------- webpack/rules/styles.ts | 1 + 5 files changed, 128 insertions(+), 90 deletions(-) delete mode 100644 .eslintignore create mode 100644 eslint.config.mjs diff --git a/.eslintignore b/.eslintignore deleted file mode 100644 index e76a2f7..0000000 --- a/.eslintignore +++ /dev/null @@ -1,4 +0,0 @@ -node_modules -dist -webpack -.eslintrc.js diff --git a/.node-version b/.node-version index 8ddbc0c..33206cb 100644 --- a/.node-version +++ b/.node-version @@ -1 +1 @@ -v18.16.0 +v22.0.0 diff --git a/eslint.config.mjs b/eslint.config.mjs new file mode 100644 index 0000000..546b2cd --- /dev/null +++ b/eslint.config.mjs @@ -0,0 +1,38 @@ +import globals from 'globals' +import react from 'eslint-plugin-react' +import prettier from 'eslint-plugin-prettier' +import typescriptEslint from '@typescript-eslint/eslint-plugin' +import { fixupPluginRules } from '@eslint/compat' +import tsParser from '@typescript-eslint/parser' + +export default [ + { + ignores: ['**/node_modules', '**/dist', '**/webpack'] + }, + { + files: ['*.ts', '*.tsx'], + plugins: { + prettier, + '@typescript-eslint': typescriptEslint, + react: fixupPluginRules(react) + }, + languageOptions: { + globals: { + ...globals.browser, + ...globals.jest + }, + parser: tsParser, + ecmaVersion: 'latest', + sourceType: 'module', + parserOptions: { + ecmaFeatures: { + jsx: true + } + } + }, + settings: { + react: { + version: 'detect' + } + } + }] diff --git a/package.json b/package.json index 64209dc..b963350 100644 --- a/package.json +++ b/package.json @@ -18,116 +18,119 @@ "postinstall": "husky install", "prettier": "prettier --write \"src/**/*.{ts,tsx,html,css,scss}\"", "lint": "run-p lint:**", - "lint:script": "eslint --fix --cache --quiet --ext .ts,.tsx ./", + "lint:script": "eslint --fix --cache --quiet ./", "lint:style": "stylelint --fix \"src/**/*.{css,scss}\"", "analyze": "npx webpack-bundle-analyzer dist/client/analyze.json", "setup": "sh setup.sh" }, "dependencies": { - "@babel/runtime": "7.22.11", - "@loadable/component": "^5.15.3", - "@loadable/server": "5.16.1", - "classnames": "^2.3.2", - "core-js": "^3.32.1", - "dotenv": "^16.3.1", + "@babel/runtime": "7.24.7", + "@loadable/component": "^5.16.4", + "@loadable/server": "5.16.5", + "classnames": "^2.5.1", + "core-js": "^3.37.1", + "dotenv": "^16.4.5", "morgan": "^1.10.0", - "postcss": "^8.4.28", - "react": "^18.2.0", - "react-dom": "^18.2.0", - "react-helmet-async": "^2.0.4", - "react-router": "^6.15.0", - "react-router-dom": "^6.15.0", - "reflect-metadata": "^0.1.13", - "uuid": "^9.0.1", - "winston": "^3.10.0", - "workbox-window": "^7.0.0", - "yup": "^1.3.3" + "postcss": "^8.4.39", + "react": "^18.3.1", + "react-dom": "^18.3.1", + "react-helmet-async": "^2.0.5", + "react-router": "^6.24.1", + "react-router-dom": "^6.24.1", + "reflect-metadata": "^0.2.2", + "uuid": "^10.0.0", + "winston": "^3.13.0", + "workbox-window": "^7.1.0", + "yup": "^1.4.0" }, "devDependencies": { - "@babel/cli": "7.22.10", - "@babel/core": "7.22.11", - "@babel/plugin-proposal-decorators": "^7.22.10", - "@babel/plugin-transform-runtime": "^7.22.10", - "@babel/preset-env": "7.22.10", - "@babel/preset-react": "^7.22.5", - "@babel/preset-typescript": "^7.22.11", - "@babel/register": "7.22.5", + "@babel/cli": "7.24.7", + "@babel/core": "7.24.7", + "@babel/plugin-proposal-decorators": "^7.24.7", + "@babel/plugin-transform-runtime": "^7.24.7", + "@babel/preset-env": "7.24.7", + "@babel/preset-react": "^7.24.7", + "@babel/preset-typescript": "^7.24.7", + "@babel/register": "7.24.6", + "@eslint/compat": "^1.1.0", "@loadable/babel-plugin": "5.16.1", "@loadable/webpack-plugin": "^5.15.2", - "@pmmmwh/react-refresh-webpack-plugin": "^0.5.11", + "@pmmmwh/react-refresh-webpack-plugin": "^0.5.15", "@svgr/webpack": "^8.1.0", - "@testing-library/dom": "^9.3.1", - "@testing-library/jest-dom": "^6.1.2", - "@testing-library/react": "^14.0.0", - "@testing-library/user-event": "^14.4.3", + "@testing-library/dom": "^10.3.1", + "@testing-library/jest-dom": "^6.4.6", + "@testing-library/react": "^16.0.0", + "@testing-library/user-event": "^14.5.2", "@types/classnames": "^2.3.0", - "@types/express": "^4.17.17", - "@types/jest": "^29.5.4", - "@types/loadable__component": "^5.13.4", - "@types/loadable__server": "^5.12.6", - "@types/loadable__webpack-plugin": "^5.7.3", + "@types/express": "^4.17.21", + "@types/jest": "^29.5.12", + "@types/loadable__component": "^5.13.9", + "@types/loadable__server": "^5.12.11", + "@types/loadable__webpack-plugin": "^5.7.6", "@types/mini-css-extract-plugin": "^2.5.0", - "@types/morgan": "^1.9.5", - "@types/node": "^20.5.6", - "@types/react-dom": "^18.2.7", + "@types/morgan": "^1.9.9", + "@types/node": "^20.14.10", + "@types/react-dom": "^18.3.0", "@types/react-router-dom": "^5.3.3", - "@types/require-from-string": "^1.2.1", - "@types/serve-favicon": "^2.5.4", - "@types/uuid": "^9.0.8", - "@types/webpack-env": "^1.18.1", - "@types/webpack-node-externals": "^3.0.0", + "@types/require-from-string": "^1.2.3", + "@types/serve-favicon": "^2.5.7", + "@types/uuid": "^10.0.0", + "@types/webpack-env": "^1.18.5", + "@types/webpack-node-externals": "^3.0.4", "@types/webpack-stats-plugin": "^0.3.5", - "@typescript-eslint/eslint-plugin": "^6.4.1", - "@typescript-eslint/parser": "^6.4.1", - "autoprefixer": "^10.4.15", + "@typescript-eslint/eslint-plugin": "^7.15.0", + "@typescript-eslint/parser": "^7.15.0", + "autoprefixer": "^10.4.19", "babel-loader": "^9.1.3", - "copy-webpack-plugin": "^11.0.0", + "copy-webpack-plugin": "^12.0.2", "cross-env": "^7.0.3", - "css-loader": "6.8.1", - "cssnano": "^6.0.1", - "eslint": "^8.48.0", - "eslint-plugin-prettier": "^5.0.0", - "eslint-plugin-react": "^7.33.2", - "express": "^4.18.2", - "fork-ts-checker-webpack-plugin": "^8.0.0", - "html-loader": "^4.2.0", - "html-webpack-plugin": "^5.5.3", - "husky": "^8.0.3", + "css-loader": "7.1.2", + "cssnano": "^7.0.4", + "eslint": "^9.6.0", + "eslint-plugin-prettier": "^5.1.3", + "eslint-plugin-react": "^7.34.3", + "eslint-plugin-react-compiler": "^0.0.0-experimental-0998c1e-20240625", + "express": "^4.19.2", + "fork-ts-checker-webpack-plugin": "^9.0.2", + "globals": "^15.8.0", + "html-loader": "^5.0.0", + "html-webpack-plugin": "^5.6.0", + "husky": "^9.0.11", "identity-obj-proxy": "^3.0.0", - "jest": "^29.6.4", - "jest-environment-jsdom": "^29.6.4", - "lint-staged": "^14.0.1", - "mini-css-extract-plugin": "^2.7.6", - "nodemon": "^3.0.1", + "jest": "^29.7.0", + "jest-environment-jsdom": "^29.7.0", + "lint-staged": "^15.2.7", + "mini-css-extract-plugin": "^2.9.0", + "nodemon": "^3.1.4", "npm-run-all": "^4.1.5", - "postcss-loader": "^7.3.3", - "postcss-scss": "^4.0.7", - "prettier": "^3.0.2", - "react-refresh": "^0.14.0", + "postcss-loader": "^8.1.1", + "postcss-scss": "^4.0.9", + "prettier": "^3.3.2", + "react-refresh": "^0.14.2", "require-from-string": "^2.0.2", - "rimraf": "^5.0.1", - "sass": "^1.66.1", - "sass-loader": "^13.3.2", + "rimraf": "^5.0.8", + "sass": "^1.77.6", + "sass-loader": "^14.2.1", "serve-favicon": "^2.5.0", - "stylelint": "^15.10.3", + "stylelint": "^16.6.1", "stylelint-config-prettier": "^9.0.5", - "stylelint-config-standard-scss": "^10.0.0", - "stylelint-order": "^6.0.3", - "ts-jest": "^29.1.1", - "ts-node": "^10.9.1", + "stylelint-config-standard-scss": "^13.1.0", + "stylelint-order": "^6.0.4", + "ts-jest": "^29.1.5", + "ts-node": "^10.9.2", "tsconfig-paths-webpack-plugin": "^4.1.0", - "typescript": "^5.2.2", - "webpack": "^5.88.2", + "typescript": "^5.5.3", + "webpack": "^5.92.1", "webpack-cli": "^5.1.4", - "webpack-dev-middleware": "^6.1.1", - "webpack-dev-server": "^4.15.1", - "webpack-hot-middleware": "2.25.4", + "webpack-dev-middleware": "^7.2.1", + "webpack-dev-server": "^5.0.4", + "webpack-hot-middleware": "2.26.1", "webpack-node-externals": "^3.0.0", "webpack-stats-plugin": "^1.1.3", - "workbox-precaching": "^7.0.0", - "workbox-recipes": "^7.0.0", - "workbox-routing": "^7.0.0", - "workbox-strategies": "^7.0.0", - "workbox-webpack-plugin": "^7.0.0" + "workbox-precaching": "^7.1.0", + "workbox-recipes": "^7.1.0", + "workbox-routing": "^7.1.0", + "workbox-strategies": "^7.1.0", + "workbox-webpack-plugin": "^7.1.0" } } diff --git a/webpack/rules/styles.ts b/webpack/rules/styles.ts index 7214cce..1c7b690 100644 --- a/webpack/rules/styles.ts +++ b/webpack/rules/styles.ts @@ -9,6 +9,7 @@ export const cssRule = { ...cssLoader, options: { modules: { + namedExport: false, exportLocalsConvention: 'camelCaseOnly', localIdentName: '[local]__[contenthash:base64:5]' }