This commit is contained in:
Bxio 2025-07-05 12:33:52 +01:00
parent 920cd74a51
commit f074bd9f5a
9 changed files with 73 additions and 39 deletions

View File

@ -1,34 +1,28 @@
############################ # Stage 1: Build
# 1⃣ BUILD STAGE FROM node:18-alpine AS builder
############################
FROM node:20-alpine AS builder
# Define diretório de trabalho
WORKDIR /app WORKDIR /app
# Copia os manifests de dependências COPY package.json package-lock.json* ./
COPY package*.json ./
# Instala dependências RUN npm ci
RUN npm install
# Copia o restante do código
COPY . . COPY . .
# Builda para produção
RUN npm run build RUN npm run build
# Stage 2: Serve com Nginx
############################
# 2⃣ NGINX STAGE
############################
FROM nginx:alpine FROM nginx:alpine
# Copia o build pronto para a pasta que o NGINX serve # Copia build estático do stage anterior
COPY --from=builder /app/dist /usr/share/nginx/html COPY --from=builder /app/dist /usr/share/nginx/html
# Exponha a porta padrão do NGINX # Remove configuração default do nginx
RUN rm /etc/nginx/conf.d/default.conf
# Copia config customizada (você pode criar o arquivo nginx.conf ao lado do Dockerfile)
COPY nginx.conf /etc/nginx/conf.d/
EXPOSE 80 EXPOSE 80
# Comando default do NGINX
CMD ["nginx", "-g", "daemon off;"] CMD ["nginx", "-g", "daemon off;"]

View File

@ -1,12 +0,0 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite + React + TS</title>
</head>
<body>
<div id="root"></div>
</body>
</html>

14
nginx.conf Normal file
View File

@ -0,0 +1,14 @@
server {
listen 80;
server_name _;
root /usr/share/nginx/html;
index index.html;
location / {
try_files $uri $uri/ /index.html;
}
gzip on;
gzip_types text/plain application/javascript application/json text/css application/xml;
}

View File

@ -1,9 +1,8 @@
{ {
"name": "meu-app", "name": "vite-react-tailwind",
"version": "1.0.0", "version": "1.0.0",
"private": true,
"scripts": { "scripts": {
"dev": "vite --port 3000", "dev": "vite",
"build": "vite build", "build": "vite build",
"preview": "vite preview" "preview": "vite preview"
}, },
@ -12,10 +11,10 @@
"react-dom": "^18.2.0" "react-dom": "^18.2.0"
}, },
"devDependencies": { "devDependencies": {
"vite": "^5.2.0", "vite": "^4.0.0",
"@vitejs/plugin-react": "^4.0.0", "tailwindcss": "^3.3.2",
"tailwindcss": "^4.0.0-beta.3", "postcss": "^8.4.21",
"postcss": "^8.4.35", "autoprefixer": "^10.4.14",
"autoprefixer": "^10.4.16" "@vitejs/plugin-react": "^3.1.0"
} }
} }

6
postcss.config.js Normal file
View File

@ -0,0 +1,6 @@
module.exports = {
plugins: {
tailwindcss: {},
autoprefixer: {},
},
}

3
src/index.css Normal file
View File

@ -0,0 +1,3 @@
@tailwind base;
@tailwind components;
@tailwind utilities;

9
src/index.jsx Normal file
View File

@ -0,0 +1,9 @@
import React from 'react'
import ReactDOM from 'react-dom/client'
import './index.css'
function App() {
return <h1 className="text-3xl font-bold underline">Olá, Docker + React + Vite + Tailwind!</h1>
}
ReactDOM.createRoot(document.getElementById('root')).render(<App />)

8
tailwind.config.js Normal file
View File

@ -0,0 +1,8 @@
/** @type {import('tailwindcss').Config} */
module.exports = {
content: ["./index.html", "./src/**/*.{js,jsx,ts,tsx}"],
theme: {
extend: {},
},
plugins: [],
}

13
vite.config.js Normal file
View File

@ -0,0 +1,13 @@
import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
export default defineConfig({
plugins: [react()],
server: {
port: 3000, // Porta para dev server (opcional)
open: true // Abre navegador automaticamente (opcional)
},
build: {
outDir: 'dist' // Diretório de saída padrão (você pode mudar se quiser)
}
})