DocumentaçãoCommerceKB do Commerce

Após a instalação, as imagens e folhas de estilos não são carregadas; somente o texto é exibido, sem gráficos

Last update: Mon Jul 15 2024 00:00:00 GMT+0000 (Coordinated Universal Time)

Criado para:

  • Administrador

Este artigo descreve os possíveis motivos e soluções para o problema em que as folhas de estilos e imagens não são carregadas após a instalação do Adobe Commerce.

Produtos e versões afetados

  • Adobe Commerce 2.2.x, 2.3.x
  • Magento Open Source 2.2.x, 2.3.x

Problema

Etapas a serem reproduzidas

  1. Instale o Adobe Commerce.
  2. Navegue até a vitrine ou o Administrador.

Resultado esperado

Os estilos são aplicados, nenhum elemento da interface do usuário parece ter estilos ausentes.

Resultado real

Os estilos não são aplicados corretamente, gráficos estão ausentes.

Causa

O caminho para imagens e folhas de estilos não está correto, devido a um URL base incorreto ou porque as regravações do servidor (CentOS, Ubuntu) não estão configuradas corretamente.

Para confirmar esse é o caso, use um inspetor de navegador da Web para verificar os caminhos para ativos estáticos e se esses ativos estão localizados no sistema de arquivos Adobe Commerce ou Magento Open Source.

Os ativos estáticos estão localizados em <magento_root>/pub/static/ , nos diretórios frontend e adminhtml.

Solução

As soluções possíveis a seguir dependem do software usado e da causa do problema:

  • Se você estiver usando o servidor Web Apache, verifique sua configuração regravações do servidor e a URL base do servidor Adobe Commerce/Magento Open Source e tente novamente. Se você configurar a diretiva AllowOverride do Apache incorretamente, os arquivos estáticos não serão enviados do local correto.

  • Se você estiver usando o servidor Web nginx, certifique-se de configurar um arquivo de host virtual. O arquivo de host virtual nginx deve atender aos seguintes critérios:

    • A diretiva include deve apontar para a amostra do arquivo de configuração nginx no diretório de instalação do Adobe Commerce/Magento Open Source. Por exemplo: include /var/www/html/magento2/nginx.conf.sample;
    • A diretiva server_name deve corresponder à URL de base especificada ao instalar o Adobe Commerce/Magento Open Source. Por exemplo: server_name 192.186.33.10;

  • Se o aplicativo estiver no modo de produção, tente implantar arquivos de exibição estáticos usando o comando magento setup:static-content:deploy. Para obter detalhes sobre a implantação de arquivos estáticos, consulte Implantar arquivos de exibição estáticos na documentação do desenvolvedor.

recommendation-more-help
8bd06ef0-b3d5-4137-b74e-d7b00485808a