feat: модульная конфигурация webpack с React 19 и TypeScript 5

- Создана модульная архитектура webpack конфигурации в config/build/
- Настроены loader'ы: Babel, TypeScript, CSS/SCSS, File, SVGR
- Добавлены плагины: HtmlWebpackPlugin, MiniCssExtractPlugin, ReactRefresh, BundleAnalyzer
- Настроен dev-сервер с HMR и поддержкой SPA роутинга
- Добавлена полная JSDoc документация на русском языке
This commit is contained in:
Ilia Mashkov
2025-11-19 09:59:39 +03:00
commit 1376a20c90
12 changed files with 493 additions and 0 deletions

57
webpack.config.ts Normal file
View File

@@ -0,0 +1,57 @@
/**
* Главный файл конфигурации webpack
*
* Точка входа для webpack, которая принимает переменные окружения
* и создает финальную конфигурацию сборки.
*
* Переменные окружения (передаются через CLI):
* - mode: режим сборки ('development' | 'production')
* - port: порт для dev-сервера (по умолчанию 3000)
* - apiUrl: URL API (по умолчанию 'http://localhost:8000')
*
* @example
* // Запуск с параметрами по умолчанию:
* pnpm dev
*
* // Запуск на другом порту:
* webpack serve --env port=8080
*
* // Production сборка:
* pnpm build
*
* @see {@link buildWebpackConfig} для деталей конфигурации
*/
import * as path from 'path'
import webpack from 'webpack'
import { buildWebpackConfig } from './config/build/buildWebpackConfig'
import { BuildEnv } from './config/build/types/config'
export default (env: BuildEnv) => {
const paths = {
entry: path.resolve(__dirname, 'src', 'index.tsx'),
html: path.resolve(__dirname, 'public', 'index.html'),
build: path.resolve(__dirname, 'dist'),
src: path.resolve(__dirname, 'src'),
}
const mode = env.mode || 'development'
const isDev = mode === 'development'
const PORT = env.port || 3000
const apiUrl = env.apiUrl || 'http://localhost:8000'
const open = true
const project = 'frontend'
const config: webpack.Configuration = buildWebpackConfig({
mode,
paths,
isDev,
port: PORT,
open,
apiUrl,
project,
})
return config
}