安装后,不加载图像和样式表;只显示文本,不加载图形

本文介绍了安装Adobe Commerce后样式表和图像未加载问题的可能原因和解决方案。

受影响的产品和版本

  • Adobe Commerce 2.2.x和2.3.x
  • Magento Open Source2.2.x和2.3.x

问题

重现步骤

  1. 安装Adobe Commerce。
  2. 导航到店面或管理员。

预期的结果

应用样式后,没有UI元素看起来像是缺少样式。

实际结果

样式应用不正确,缺少图形。

原因

指向图像和样式表的路径不正确,可能是因为基础URL不正确,也可能是因为服务器重写(CentOS、Ubuntu)设置不正确。

要确认这种情况,请使用Web浏览器检查器检查静态资源的路径,并验证这些资源是否位于Adobe Commerce或Magento Open Source文件系统中。

静态资产位于frontendadminhtml目录中的<magento_root>/pub/static/下。

解决方案

根据您使用的软件以及问题的原因,以下是可采用的解决方案:

  • 如果您使用的是Apache Web Server,请验证server rewrites设置和Adobe Commerce/Magento Open Source服务器的基本URL,然后重试。 如果未正确设置Apache AllowOverride指令,则不会从正确的位置提供静态文件。

  • 如果您使用的是nginx Web服务器,请务必配置虚拟主机文件。 nginx虚拟主机文件必须满足以下条件:

    • include指令必须指向Adobe Commerce/Magento Open Source安装目录中的nginx配置文件示例。 例如: include /var/www/html/magento2/nginx.conf.sample;
    • server_name指令必须与您在安装Adobe Commerce/Magento Open Source时指定的基本URL匹配。 例如: server_name 192.186.33.10;
  • 如果应用程序处于生产模式,请尝试使用magento setup:static-content:deploy命令部署静态视图文件。 有关部署静态文件的详细信息,请参阅我们的开发人员文档中的部署静态视图文件

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