83 lines
2.1 KiB
Markdown
83 lines
2.1 KiB
Markdown
# 🚀 Production сборка с Vite
|
||
|
||
## ✅ Как работает
|
||
|
||
### Встроенные переменные Vite
|
||
|
||
Vite автоматически определяет режим сборки:
|
||
- **Dev**: `mode = 'development'`
|
||
- **Production**: `mode = 'production'`
|
||
|
||
В `vite.config.ts`:
|
||
```typescript
|
||
export default defineConfig(({ mode }) => {
|
||
const isProd = mode === 'production';
|
||
|
||
return {
|
||
base: isProd
|
||
? 'https://static.brojs.ru/landing/main/' // Production CDN
|
||
: '/', // Dev локально
|
||
// ...
|
||
}
|
||
});
|
||
```
|
||
|
||
## 🌐 Команды
|
||
|
||
### Dev режим
|
||
```bash
|
||
npm start # mode = 'development'
|
||
npm run dev # mode = 'development'
|
||
```
|
||
- Base: `/`
|
||
- URL: `http://localhost:8099/`
|
||
- Ассеты: локальные пути
|
||
|
||
### Production сборка
|
||
```bash
|
||
npm run build # mode = 'production'
|
||
```
|
||
- Base: `https://static.brojs.ru/landing/main/`
|
||
- Все пути автоматически заменяются на CDN!
|
||
|
||
## 📦 Результат production сборки
|
||
|
||
### index.html (главная)
|
||
```html
|
||
<script src="https://static.brojs.ru/landing/main/main.[hash].js"></script>
|
||
```
|
||
|
||
### terms.html (Terms)
|
||
```html
|
||
<link rel="stylesheet" href="https://static.brojs.ru/landing/main/terms.[hash].css">
|
||
```
|
||
|
||
## 🎯 Кроссплатформенность
|
||
|
||
✅ **Windows**: работает
|
||
✅ **Linux**: работает
|
||
✅ **macOS**: работает
|
||
|
||
Vite использует встроенный параметр `mode`, который работает **везде без дополнительных пакетов**!
|
||
|
||
## 🔧 Альтернативный способ (если нужен кастомный env)
|
||
|
||
Если понадобится установить свои переменные:
|
||
|
||
### Установи cross-env
|
||
```bash
|
||
npm install --save-dev cross-env
|
||
```
|
||
|
||
### Обнови package.json
|
||
```json
|
||
{
|
||
"scripts": {
|
||
"build": "cross-env NODE_ENV=production vite build"
|
||
}
|
||
}
|
||
```
|
||
|
||
Но это **не нужно** для нашего случая! Vite сам всё делает правильно! ✨
|
||
|