fix: Resolve i18n dependency issues for different environments
- Update i18n package versions to stable, compatible versions - Add install-i18n.sh script for easy setup in any environment - Create comprehensive I18N_SETUP.md troubleshooting guide - Use legacy-peer-deps flag to avoid npm conflicts - Provide clear instructions for Docker and local environments This ensures the German translation feature works correctly across different development and deployment environments. 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
+125
@@ -0,0 +1,125 @@
|
||||
# i18n Setup Guide for MinIO WebUI
|
||||
|
||||
This guide helps you set up the internationalization (i18n) dependencies for MinIO WebUI in different environments.
|
||||
|
||||
## Quick Fix
|
||||
|
||||
If you're getting errors about missing `react-i18next`, `i18next`, or `i18next-browser-languagedetector` modules:
|
||||
|
||||
### Option 1: Using the Install Script (Recommended)
|
||||
|
||||
```bash
|
||||
cd frontend
|
||||
./install-i18n.sh
|
||||
```
|
||||
|
||||
### Option 2: Manual Installation
|
||||
|
||||
```bash
|
||||
cd frontend
|
||||
rm -rf node_modules package-lock.json
|
||||
npm install --legacy-peer-deps
|
||||
```
|
||||
|
||||
### Option 3: Docker Environment
|
||||
|
||||
If running in Docker, rebuild the frontend container:
|
||||
|
||||
```bash
|
||||
docker-compose down frontend
|
||||
docker-compose up -d --build frontend
|
||||
```
|
||||
|
||||
## Troubleshooting
|
||||
|
||||
### Module Not Found Errors
|
||||
|
||||
If you see errors like:
|
||||
- `Module not found: Error: Can't resolve 'react-i18next'`
|
||||
- `Cannot find module 'i18next' or its corresponding type declarations`
|
||||
|
||||
**Solution:**
|
||||
1. Delete `node_modules` and `package-lock.json`
|
||||
2. Run `npm install --legacy-peer-deps`
|
||||
3. If issues persist, install packages explicitly:
|
||||
```bash
|
||||
npm install i18next@^23.7.6 react-i18next@^13.5.0 i18next-browser-languagedetector@^7.2.0 --legacy-peer-deps
|
||||
```
|
||||
|
||||
### Peer Dependency Conflicts
|
||||
|
||||
Use the `--legacy-peer-deps` flag when installing to bypass peer dependency conflicts:
|
||||
|
||||
```bash
|
||||
npm install --legacy-peer-deps
|
||||
```
|
||||
|
||||
### TypeScript Declaration Errors
|
||||
|
||||
If TypeScript can't find type declarations, ensure you have the correct versions:
|
||||
- i18next: ^23.7.6
|
||||
- react-i18next: ^13.5.0
|
||||
- i18next-browser-languagedetector: ^7.2.0
|
||||
|
||||
## Verifying Installation
|
||||
|
||||
After installation, verify the packages are installed:
|
||||
|
||||
```bash
|
||||
npm list i18next react-i18next i18next-browser-languagedetector
|
||||
```
|
||||
|
||||
You should see all three packages listed with their versions.
|
||||
|
||||
## Development Environment Setup
|
||||
|
||||
1. **Clone the repository**
|
||||
2. **Navigate to frontend directory**: `cd frontend`
|
||||
3. **Run the install script**: `./install-i18n.sh`
|
||||
4. **Start the development server**: `npm start`
|
||||
|
||||
## Production Build
|
||||
|
||||
For production builds:
|
||||
|
||||
```bash
|
||||
cd frontend
|
||||
npm install --legacy-peer-deps
|
||||
npm run build
|
||||
```
|
||||
|
||||
## Docker Setup
|
||||
|
||||
The Dockerfile already includes the necessary dependencies. If you need to rebuild:
|
||||
|
||||
```bash
|
||||
docker-compose build frontend
|
||||
docker-compose up -d frontend
|
||||
```
|
||||
|
||||
## Language Configuration
|
||||
|
||||
- Default language: German (de)
|
||||
- Fallback language: English (en)
|
||||
- Language selection is persisted in localStorage
|
||||
- Language can be changed via the dropdown in the app header
|
||||
|
||||
## Translation Files Location
|
||||
|
||||
- German: `/frontend/src/locales/de/`
|
||||
- English: `/frontend/src/locales/en/`
|
||||
|
||||
Each language has the following translation files:
|
||||
- `common.json` - Navigation and common UI elements
|
||||
- `dashboard.json` - Dashboard page translations
|
||||
- `quickWizard.json` - Quick Start Wizard translations
|
||||
- `reports.json` - Reports page translations
|
||||
- `errors.json` - Error messages
|
||||
|
||||
## Need Help?
|
||||
|
||||
If you continue to experience issues:
|
||||
1. Check that you're using Node.js version 16 or higher
|
||||
2. Clear npm cache: `npm cache clean --force`
|
||||
3. Delete `node_modules`, `package-lock.json`, and reinstall
|
||||
4. Check the console for specific error messages
|
||||
Reference in New Issue
Block a user