首页 > 解决方案 > PHP 自定义“MVC”:以正确的方式包括包含 HTML/CSS/JS 的“模块”

问题描述

我已经创建了我的自定义 PHP 'MVC',如果你会这样称呼它,它的结构将页面和某些组件视为“模块”,通过将它们存储在包含与“模块”相关的任何代码的自己的文件夹中。模块大致如下所示:

├── popup/
│   ├── popup.css
│   ├── popup.js
│   └── popup.php
└── home/
    ├── index.php
    ├── css
    │   └── style.css
    ├── js
    │   └── script.js
    └── html
        └── layout.php

我发现这种结构更适合使用,显然这个人也这样做:像你布置你的房子一样布置你的代码

popup是一个可以添加到视图中的组件,而home一个视图(我没有将它们存储在同一位置,而是为了这个示例而简化了结构)。

我希望能够轻松地将弹出组件包含在它使用的视图中。我现在正在做的是分别包含 CSS、JS 和 HTML,如下所示:

on home/css/style.css:
@import "../../popup/popup.css"

on home/js/script.js:
// @codekit-prepend '../../popup/popup.js';

on home/html/layout.php:
include '../../popup/popup.php';

我脑海中的完美案例场景是能够在每个视图上包含一个带有一个衬里的弹出组件,类似于包含一个 PHP 库。有正确的方法吗?

我之前使用链接脚本在 html 文档中呈现了弹出窗口的 CSS 和 JS ,因此我可以通过仅包含popup.php来包含完整的模块。这增加了文档必须加载的外部 CSS 和 JS 文件的数量。传说还包含一个大的 CSS/JS 文件比包含许多小文件更好。这在 2020 年仍然有效吗?

标签: javascriptphphtmlcsstemplating

解决方案


回复:“传说有它”:捆绑和缩小将减少多个请求的开销和总字节数。

你的问题的另一部分——“我如何简化模块的使用”——可能会涉及到加强你的 MVC 代码库。您可能想要做的是每个模块都有一个核心文件或例程,将由您的基本代码调用.. include_me.php 或 class::bootstrap(&$theApp) .. 您的里程可能会有所不同 - 然后在打算包含 CSS 和 JS 的部分,您将遍历 $pageCSS、$headJS 和 $bodyJS 等应用程序数组,并在适当的位置包含 include_me/bootstrap 例程放入这些数组中的所有文件。


推荐阅读