Após o desenvolvimento de um projeto frontend com Vue.js, é necessário configurar um servidor de cache e proxy reverso para servir os arquivos estáticos gerados pelo build. O Nginx é uma escolha popular devido à sua leveza e desempenho. Este guia detalha o processo de instalação manual do Nginx no CentOS 7 (sem dependência de repositórios EPEL) e sua configuração para servir uma aplicação Vue.js produzida.

Pré-requisitos e dependências

O Nginx requer bibliotecas extras para Suporte completo:

• PCRE – para módulo rewrite
• OpenSSL – para funcionalidade SSL/TLS
• Zlib – para compactação gzip

Todos os comandos abaixo devem ser executados com privilégios de root (ou via sudo).

Instalação das dependências

 yum -y install gcc gcc-c++ make

Em seguida, baixe e compile as bibliotecas conforme abaixo.

1. PCRE

cd /usr/local
wget https://sourceforge.net/projects/pcre/files/pcre/8.45/pcre-8.45.tar.gz/download -O pcre-8.45.tar.gz
tar xzf pcre-8.45.tar.gz
cd pcre-8.45
./configure
make && make install

2. OpenSSL

cd /usr/local
wget https://www.openssl.org/source/openssl-1.1.1q.tar.gz
tar xzf openssl-1.1.1q.tar.gz
cd openssl-1.1.1q
./config --prefix=/usr/local/openssl shared
make && make install

3. Zlib

cd /usr/local
wget https://zlib.net/zlib-1.2.12.tar.gz
tar xzf zlib-1.2.12.tar.gz
cd zlib-1.2.12
./configure
make && make install

Compilação e instalação do Nginx

cd /usr/local
wget https://nginx.org/download/nginx-1.22.0.tar.gz
tar xzf nginx-1.22.0.tar.gz
cd nginx-1.22.0

./configure \
  --user=nobody \
  --group=nobody \
  --prefix=/usr/local/nginx \
  --with-http_ssl_module \
  --with-http_gzip_static_module \
  --with-http_realip_module \
  --with-http_stub_status_module \
  --with-pcre=/usr/local/pcre-8.45 \
  --with-zlib=/usr/local/zlib-1.2.12 \
  --with-openssl=/usr/local/openssl-1.1.1q

make && make install

Variável de ambiente e verificação

echo 'export NGINX_HOME=/usr/local/nginx' >> /etc/profile
echo 'export PATH=$PATH:$NGINX_HOME/sbin' >> /etc/profile
source /etc/profile
nginx -v

Se a saída exibir a versão (ex: nginx version: nginx/1.22.0), o ambiente está pronto.

Gerenciamento do serviço

# Iniciar
nginx

# Parar imediatamente (sinal SIGTERM)
nginx -s stop

# Parar gracefully (sinal SIGQUIT)
nginx -s quit

# Recarregar configuração (reaplicar sem interrupção)
nginx -s reload

# Verificar processos
ps aux | grep nginx
killall nginx

Configuração básica do Nginx

O arquivo de configuração padrão é /usr/local/nginx/conf/nginx.conf. Estrutura típica:

http {<br></br>  server {<br></br>    listen 80;<br></br>    server_name _;<br></br>    location / {<br></br>      root /usr/local/nginx/html;<br></br>      index index.html;<br></br>      try_files $uri $uri/ /index.html;<br></br>    }<br></br>  }<br></br>}O uso de try_files é essencial para aplicações Vue CLI (ou Vite) que utilizam router history mode, pois redireciona todas as rotas para index.html.

Distribuição do projeto Vue.js

1. No projeto Vue local, modifique o arquivo config/index.js ou vite.config.ts (dependendo da versão usada), garantindo que:
   • O host não tenha restrições que bloquie acesso via IP
   • APIs de backend sejam referenciadas corretamente (ex: IP local da VM)
2. Construa os aqruivos estáticos: ``` npm run build

3. Envelope os conteúdos de dist/ (não o próprio diretório dist) e copie para: ``` /usr/local/nginx/html/

4. Reinicie ou recarregue o Nginx após ajustar o arquivo nginx.conf.

Acesso ao projeto

Abra o navegador no cliente e acesse: http://IP_DO_SERVIDOR/. Caso o build seja correto, o aplicativo Vue.js será carregado normalmente.