From a27ff2df61048900c4d2c42acc2475e9bdbef58a Mon Sep 17 00:00:00 2001 From: Pellya Roman Date: Sun, 19 Jul 2026 14:17:25 +0300 Subject: [PATCH] Configure babel loader, imporove building by transform ts and runtime babel plugins --- config/babel/babelPemovePropsPlugin.ts | 21 +++++++ config/build/buildLoaders.ts | 14 ++--- config/build/loaders/babelLoader.ts | 21 ++++++- extractedTranslations/ru/about.json | 3 + extractedTranslations/ru/article-details.json | 9 +++ extractedTranslations/ru/article.json | 17 ++++++ extractedTranslations/ru/comments.json | 3 + extractedTranslations/ru/main.json | 3 + extractedTranslations/ru/profile.json | 22 +++++++ package-lock.json | 60 ++++++++++++++++--- package.json | 2 + 11 files changed, 156 insertions(+), 19 deletions(-) create mode 100644 config/babel/babelPemovePropsPlugin.ts create mode 100644 extractedTranslations/ru/about.json create mode 100644 extractedTranslations/ru/article-details.json create mode 100644 extractedTranslations/ru/article.json create mode 100644 extractedTranslations/ru/comments.json create mode 100644 extractedTranslations/ru/main.json create mode 100644 extractedTranslations/ru/profile.json diff --git a/config/babel/babelPemovePropsPlugin.ts b/config/babel/babelPemovePropsPlugin.ts new file mode 100644 index 00000000..fd88eb0f --- /dev/null +++ b/config/babel/babelPemovePropsPlugin.ts @@ -0,0 +1,21 @@ +import { PluginItem } from '@babel/core'; + +export default function (): PluginItem { + return { + visitor: { + Program(path, state) { + const forbidden = state.opts.props || []; + + path.traverse({ + JSXIdentifier(current) { + const nodeName = current.node.name; + + if (forbidden.includes(nodeName)) { + current.parentPath.remove(); + } + }, + }); + }, + }, + }; +} diff --git a/config/build/buildLoaders.ts b/config/build/buildLoaders.ts index a5f158d9..2dc4fc36 100644 --- a/config/build/buildLoaders.ts +++ b/config/build/buildLoaders.ts @@ -11,17 +11,11 @@ export function buildLoaders(options: BuildOptions): webpack.RuleSetRule[] { }; // So far I have disconnected this Lowder because of Extractranslations creating files each time - const babelLoader = babelLoaders(options); + const codeBabelLoader = babelLoaders({...options, isTsx: false}); + const tsxCodeBabelLoader = babelLoaders({...options, isTsx: true}); const cssLoader = buildCssLoader(isDev); - // Если не используется typeScript - нужен babel-loader - const typescirptLoader = { - test: /\.tsx?$/, - use: 'ts-loader', - exclude: /node_modules/, - }; - const fontLoader = { test: /\.(woff|woff2|eot|ttf|otf)$/i, type: 'asset/resource', @@ -39,8 +33,8 @@ export function buildLoaders(options: BuildOptions): webpack.RuleSetRule[] { return [ fileLoader, svgLoader, - babelLoader, - typescirptLoader, + codeBabelLoader, + tsxCodeBabelLoader, cssLoader, fontLoader, ]; diff --git a/config/build/loaders/babelLoader.ts b/config/build/loaders/babelLoader.ts index 7927855b..471d3937 100644 --- a/config/build/loaders/babelLoader.ts +++ b/config/build/loaders/babelLoader.ts @@ -1,8 +1,13 @@ +import babelPemovePropsPlugin from '../../babel/babelPemovePropsPlugin'; import { BuildOptions } from '../types/config'; -export function babelLoaders({ isDev }: BuildOptions) { +interface BuildBabelLoaderProps extends BuildOptions { + isTsx?: boolean; +} + +export function babelLoaders({ isDev, isTsx }: BuildBabelLoaderProps) { return { - test: /\.(js|jsx|tsx)$/, + test: isTsx ? /\.(jsx|tsx)$/ : /\.(js|ts)$/, exclude: /node_modules/, use: { loader: 'babel-loader', @@ -16,6 +21,18 @@ export function babelLoaders({ isDev }: BuildOptions) { keyAsDefaultValue: true, }, ], + [ + "@babel/plugin-transform-typescript", + { + isTsx + } + ], + "@babel/plugin-transform-runtime", + isTsx && !isDev && [babelPemovePropsPlugin, + { + props: ['data-testid'] + } + ], isDev && require.resolve('react-refresh/babel'), ].filter(Boolean), }, diff --git a/extractedTranslations/ru/about.json b/extractedTranslations/ru/about.json new file mode 100644 index 00000000..21184075 --- /dev/null +++ b/extractedTranslations/ru/about.json @@ -0,0 +1,3 @@ +{ + "About us": "About us" +} diff --git a/extractedTranslations/ru/article-details.json b/extractedTranslations/ru/article-details.json new file mode 100644 index 00000000..59cef00f --- /dev/null +++ b/extractedTranslations/ru/article-details.json @@ -0,0 +1,9 @@ +{ + "An error occurred while loading the article": "An error occurred while loading the article", + "Back to list": "Back to list", + "Comments": "Comments", + "Enter the comment": "Enter the comment", + "Error": "Error", + "Recommendations": "Recommendations", + "Send comment": "Send comment" +} diff --git a/extractedTranslations/ru/article.json b/extractedTranslations/ru/article.json new file mode 100644 index 00000000..16501f99 --- /dev/null +++ b/extractedTranslations/ru/article.json @@ -0,0 +1,17 @@ +{ + "All articles": "All articles", + "Articles not found": "Articles not found", + "Economics": "Economics", + "Error": "Error", + "IT": "IT", + "Read more": "Read more", + "Science": "Science", + "Search": "Search", + "Sort by": "Sort by", + "ascending": "ascending", + "by": "by", + "created at": "created at", + "descending": "descending", + "title": "title", + "views": "views" +} diff --git a/extractedTranslations/ru/comments.json b/extractedTranslations/ru/comments.json new file mode 100644 index 00000000..c1cedd95 --- /dev/null +++ b/extractedTranslations/ru/comments.json @@ -0,0 +1,3 @@ +{ + "No comments": "No comments" +} diff --git a/extractedTranslations/ru/main.json b/extractedTranslations/ru/main.json new file mode 100644 index 00000000..c7715638 --- /dev/null +++ b/extractedTranslations/ru/main.json @@ -0,0 +1,3 @@ +{ + "Main page": "Main page" +} diff --git a/extractedTranslations/ru/profile.json b/extractedTranslations/ru/profile.json new file mode 100644 index 00000000..5e2d0fef --- /dev/null +++ b/extractedTranslations/ru/profile.json @@ -0,0 +1,22 @@ +{ + "Cancel": "Cancel", + "City": "City", + "Edit": "Edit", + "Enter link to avatar": "Enter link to avatar", + "Enter username": "Enter username", + "Profile": "Profile", + "Save": "Save", + "Select country": "Select country", + "There was an error": "There was an error", + "Try to update the page": "Try to update the page", + "Your age": "Your age", + "Your lastname": "Your lastname", + "Your name": "Your name", + "errors": { + "incorrectAge": "incorrectAge", + "incorrectCountry": "incorrectCountry", + "incorrectUserData": "incorrectUserData", + "noData": "noData", + "serverError": "serverError" + } +} diff --git a/package-lock.json b/package-lock.json index cca71d0e..3e40a1c6 100644 --- a/package-lock.json +++ b/package-lock.json @@ -23,6 +23,8 @@ }, "devDependencies": { "@babel/core": "^7.17.5", + "@babel/plugin-transform-runtime": "^7.18.10", + "@babel/plugin-transform-typescript": "^7.18.12", "@babel/preset-env": "^7.16.11", "@babel/preset-react": "^7.16.7", "@babel/preset-typescript": "^7.16.7", @@ -1883,6 +1885,50 @@ "@babel/core": "^7.0.0-0" } }, + "node_modules/@babel/plugin-transform-runtime": { + "version": "7.18.10", + "resolved": "https://registry.npmjs.org/@babel/plugin-transform-runtime/-/plugin-transform-runtime-7.18.10.tgz", + "integrity": "sha512-q5mMeYAdfEbpBAgzl7tBre/la3LeCxmDO1+wMXRdPWbcoMjR3GiXlCLk7JBZVVye0bqTGNMbt0yYVXX1B1jEWQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "@babel/helper-module-imports": "^7.18.6", + "@babel/helper-plugin-utils": "^7.18.9", + "babel-plugin-polyfill-corejs2": "^0.3.2", + "babel-plugin-polyfill-corejs3": "^0.5.3", + "babel-plugin-polyfill-regenerator": "^0.4.0", + "semver": "^6.3.0" + }, + "engines": { + "node": ">=6.9.0" + }, + "peerDependencies": { + "@babel/core": "^7.0.0-0" + } + }, + "node_modules/@babel/plugin-transform-runtime/node_modules/babel-plugin-polyfill-regenerator": { + "version": "0.4.1", + "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-regenerator/-/babel-plugin-polyfill-regenerator-0.4.1.tgz", + "integrity": "sha512-NtQGmyQDXjQqQ+IzRkBVwEOz9lQ4zxAQZgoAYEtU9dJjnl1Oc98qnN7jcp+bE7O7aYzVpavXE3/VKXNzUbh7aw==", + "dev": true, + "license": "MIT", + "dependencies": { + "@babel/helper-define-polyfill-provider": "^0.3.3" + }, + "peerDependencies": { + "@babel/core": "^7.0.0-0" + } + }, + "node_modules/@babel/plugin-transform-runtime/node_modules/semver": { + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", + "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==", + "dev": true, + "license": "ISC", + "bin": { + "semver": "bin/semver.js" + } + }, "node_modules/@babel/plugin-transform-shorthand-properties": { "version": "7.24.1", "resolved": "https://registry.npmjs.org/@babel/plugin-transform-shorthand-properties/-/plugin-transform-shorthand-properties-7.24.1.tgz", @@ -1960,15 +2006,15 @@ } }, "node_modules/@babel/plugin-transform-typescript": { - "version": "7.24.4", - "resolved": "https://registry.npmjs.org/@babel/plugin-transform-typescript/-/plugin-transform-typescript-7.24.4.tgz", - "integrity": "sha512-79t3CQ8+oBGk/80SQ8MN3Bs3obf83zJ0YZjDmDaEZN8MqhMI760apl5z6a20kFeMXBwJX99VpKT8CKxEBp5H1g==", + "version": "7.18.12", + "resolved": "https://registry.npmjs.org/@babel/plugin-transform-typescript/-/plugin-transform-typescript-7.18.12.tgz", + "integrity": "sha512-2vjjam0cum0miPkenUbQswKowuxs/NjMwIKEq0zwegRxXk12C9YOF9STXnaUptITOtOJHKHpzvvWYOjbm6tc0w==", "dev": true, + "license": "MIT", "dependencies": { - "@babel/helper-annotate-as-pure": "^7.22.5", - "@babel/helper-create-class-features-plugin": "^7.24.4", - "@babel/helper-plugin-utils": "^7.24.0", - "@babel/plugin-syntax-typescript": "^7.24.1" + "@babel/helper-create-class-features-plugin": "^7.18.9", + "@babel/helper-plugin-utils": "^7.18.9", + "@babel/plugin-syntax-typescript": "^7.18.6" }, "engines": { "node": ">=6.9.0" diff --git a/package.json b/package.json index e853d898..e6659801 100644 --- a/package.json +++ b/package.json @@ -34,6 +34,8 @@ "license": "ISC", "devDependencies": { "@babel/core": "^7.17.5", + "@babel/plugin-transform-runtime": "^7.18.10", + "@babel/plugin-transform-typescript": "^7.18.12", "@babel/preset-env": "^7.16.11", "@babel/preset-react": "^7.16.7", "@babel/preset-typescript": "^7.16.7",