Magento管理主题资源-Magento零基础到架构师(内容设计)

当前位置:　首页>> 技术小册>> Magento零基础到架构师(内容设计)

此 静态文件 是主题使用的资产（如CSS、字体、图像和JavaScript）的集合。 静态文件的位置在 基本URL 配置。 我们可以向每个静态文件的URL添加数字签名，以便浏览器能够检测到较新版本何时可用。 如果签名与浏览器缓存中存储的签名不同，则使用较新版本的文件。

对于标准安装，与主题关联的资产将整理在 web 文件夹，该文件夹位于 Commerce 根。

`[commerce_root]/app/design/frontend/Magento/[theme_name]/web`

**向静态文件URL添加数字签名**

在 管理员 侧栏，转到 Stores > Settings>Configuration.

在左侧面板中，展开 Advanced 并选择 Developer.

展开 扩展选择器 该 Static Files Settings 部分。

![](/uploads/images/20240706/1446a9cbf66afc4b688c163378fbbfd8.png)

设置 Sign Static Files 到 Yes.

完成后，单击 Save Config.

| 文件类型 | 描述                                                                                           |
|------|----------------------------------------------------------------------------------------------|
| CSS  | 控制与外观关联的视觉样式。 服务器上的示例位置： [commerce]/app/design/frontend/Magento/[theme]/web/css              |
| 字体   | 提供主题可用的字体。 服务器上的位置： [commerce]/app/design/frontend/Magento/[theme]/web/fonts                 |
| 图像   | 提供主题使用的图形资源，包括按钮、背景纹理等。 服务器上的示例位置： [commerce]/app/design/frontend/Magento/[theme]/web/images |
| JS   | 特定于主题的JavaScript例程和可调用函数。 服务器上的示例位置： [commerce]/app/design/frontend/Magento/[theme]/web/js   |

**合并CSS文件**

作为优化网站并减少页面加载时间努力的一部分，我们可以通过将CSS文件合并到单个压缩文件来减少单独的CSS文件数量。 如果打开合并的CSS文件，我们会看到一个连续的文本流，其中删除了换行符。 我们无法编辑合并的文件，因此最好等到退出开发模式并且不再频繁更改CSS。

在 管理员 侧栏，转到 Stores > Settings>Configuration.

在左侧面板中， Advanced 并选择 Developer.

展开 扩展选择器 该 CSS Settings 部分。

![](/uploads/images/20240706/731fb0cbeb8181c22197367d767b8061.png)

设置 Merge CSS Files 到 Yes.

完成后，单击 Save Config.

**合并JavaScript文件**

可以将多个JavaScript文件合并到单个压缩文件中，以缩短页面加载时间。 如果打开合并的JavaScript文件，我们会看到一个连续的文本流，其中删除了换行符。 如果我们已完成开发过程并且代码不含错误，则可以考虑合并文件。

在 管理员 侧栏，转到 Stores > Settings>Configuration.

在左侧面板中， Advanced 并选择 Developer.

展开 扩展选择器 该 JavaScript Settings 部分。

![](/uploads/images/20240706/817091f7a41128daa2a7cf42613ae42d.png)

设置 Merge JavaScript Files 到 Yes.

完成后，单击 Save Config.

该分类下的相关小册推荐：

Swoole高性能框架-Hyperf

PHP8实战小册

Magento零基础到架构师(系统管理)

PHP合辑5-SPL标准库

Laravel(10.x)从入门到精通(九)

Laravel(10.x)从入门到精通(十)

Laravel(10.x)从入门到精通(十二)

经典设计模式PHP版

PHP高并发秒杀入门与实战

Laravel(10.x)从入门到精通(十九)

PHP程序员的设计模式

全面掌握Magento2-从配置到优化