josantonius/asset

* PHP 风格和脚本处理库：添加、压缩、统一和打印。

维护者

详细信息

github.com/josantonius/php-asset

源代码

问题

资助包维护！
Josantonius

安装次数: 171

依赖者: 2

建议者: 0

安全: 0

星标: 9

关注者: 3

分支: 3

开放性问题: 0

v2.0.3 2022-08-10 21:12 UTC

Requires

  • php: ^8.1

Requires (Dev)

MIT ef709d0b805dea65ceacb58be98dd9e576dee395

phpcssassetJSstylesscriptsprint

This package is auto-updated.

Last update: 2024-08-29 04:42:55 UTC

README

Latest Stable Version License Total Downloads CI CodeCov PSR1 PSR4 PSR12

翻译： 西班牙语

PHP 处理 HTML 链接和脚本的库。

要求

  • 操作系统：Linux | Windows。

  • PHP 版本：8.1 | 8.2。

安装

安装此扩展的首选方式是通过 Composer。

要安装 PHP Asset 库，只需

composer require josantonius/asset

上面的命令只会安装必要的文件，如果您想 下载整个源代码，可以使用

composer require josantonius/asset --prefer-source

您也可以使用 Git 克隆整个仓库

git clone https://github.com/josantonius/php-asset.git

可用类

Asset 类

Josantonius\Asset\Asset

打印添加到身体的脚本

public function outputBodyScripts(): string;

打印添加到头的脚本

public function outputHeadScripts(): string;

打印添加的链接

public function outputLinks(): string;

Asset 门面

Josantonius\Asset\Facades\Asset

添加身体脚本

/**
 * @see https://mdn.org.cn/en-US/docs/Web/HTML/Element/script
 */
public static function addBodyScript(
    null|bool   $async          = null,
    null|string $crossorigin    = null,
    null|bool   $defer          = null,
    null|string $fetchpriority  = null,
    null|string $integrity      = null,
    null|bool   $nomodule       = null,
    null|string $nonce          = null,
    null|string $referrerpolicy = null,
    null|string $src            = null,
    null|string $type           = null
): BodyScript;

添加头部脚本

/**
 * @see https://mdn.org.cn/en-US/docs/Web/HTML/Element/script
 */
public static function addHeadScript(
    null|bool   $async          = null,
    null|string $crossorigin    = null,
    null|bool   $defer          = null,
    null|string $fetchpriority  = null,
    null|string $integrity      = null,
    null|bool   $nomodule       = null,
    null|string $nonce          = null,
    null|string $referrerpolicy = null,
    null|string $src            = null,
    null|string $type           = null
): HeadScript;

添加链接

/**
 * @see https://mdn.org.cn/en-US/docs/Web/HTML/Element/link
 */
public static function addLink(
    null|string $as             = null,
    null|string $crossorigin    = null,
    null|bool   $disabled       = null,
    null|string $fetchpriority  = null,
    null|string $href           = null,
    null|string $hreflang       = null,
    null|string $imagesizes     = null,
    null|string $imagesrcset    = null,
    null|string $integrity      = null,
    null|string $media          = null,
    null|string $prefetch       = null,
    null|string $referrerpolicy = null,
    null|string $rel            = null,
    null|string $sizes          = null,
    null|string $target         = null,
    null|string $title          = null,
    null|string $type           = null,
): Link;

打印添加到身体的脚本

public static function outputBodyScripts(): string;

打印添加到头的脚本

public static function outputHeadScripts(): string;

打印添加的链接

public static function outputLinks(): string;

BodyScript 类

Josantonius\Asset\Elements\BodyScript

添加身体脚本

/**
 * @see https://mdn.org.cn/en-US/docs/Web/HTML/Element/script
 */
public function __construct(
    private null|bool   $async          = null,
    private null|string $crossorigin    = null,
    private null|bool   $defer          = null,
    private null|string $fetchpriority  = null,
    private null|string $integrity      = null,
    private null|bool   $nomodule       = null,
    private null|string $nonce          = null,
    private null|string $referrerpolicy = null,
    private null|string $src            = null,
    private null|string $type           = null
);

HeadScript 类

Josantonius\Asset\Elements\HeadScript

添加头部脚本

/**
 * @see https://mdn.org.cn/en-US/docs/Web/HTML/Element/script
 */
public function __construct(
    private null|bool   $async          = null,
    private null|string $crossorigin    = null,
    private null|bool   $defer          = null,
    private null|string $fetchpriority  = null,
    private null|string $integrity      = null,
    private null|bool   $nomodule       = null,
    private null|string $nonce          = null,
    private null|string $referrerpolicy = null,
    private null|string $src            = null,
    private null|string $type           = null
);

Link 类

Josantonius\Asset\Elements\Link

添加链接

/**
 * @see https://mdn.org.cn/en-US/docs/Web/HTML/Element/link
 */
public function __construct(
    private null|string $as             = null,
    private null|string $crossorigin    = null,
    private null|bool   $disabled       = null,
    private null|string $fetchpriority  = null,
    private null|string $href           = null,
    private null|string $hreflang       = null,
    private null|string $imagesizes     = null,
    private null|string $imagesrcset    = null,
    private null|string $integrity      = null,
    private null|string $media          = null,
    private null|string $prefetch       = null,
    private null|string $referrerpolicy = null,
    private null|string $rel            = null,
    private null|string $sizes          = null,
    private null|string $target         = null,
    private null|string $title          = null,
    private null|string $type           = null,
);

用法

此库的使用示例

添加身体脚本

use Josantonius\Asset\Elements\BodyScript;

new BodyScript(
    src: 'https://example.com/script.js'
);
use Josantonius\Asset\Facades\Asset;

Asset::addBodyScript(
    src: 'script.js',
    type: 'text/javascript'
);

添加头部脚本

use Josantonius\Asset\Elements\HeadScript;

new HeadScript(
    src: 'script.js',
    type: 'module'
);
use Josantonius\Asset\Facades\Asset;

Asset::addHeadScript(
    crossorigin: 'anonymous',
    defer: true,
    integrity: 'sha256-n9+',
    src: 'https://example.com/script.js',
    type: 'text/javascript'
);

添加链接

use Josantonius\Asset\Elements\Link;

new Link(
    crossorigin: 'anonymous',
    href: 'https://example.com/style.css',
    integrity: 'sha256-n9+',
    media: 'all',
    rel: 'stylesheet'
);
use Josantonius\Asset\Facades\Asset;

Asset::addLink(
    href: 'https://example.com/style.css',
    rel: 'stylesheet'
);

打印添加到身体的脚本

use Josantonius\Asset\Asset;

$asset = new Asset();

echo $asset->outputBodyScripts();
use Josantonius\Asset\Facades\Asset;

echo Asset::outputBodyScripts();

打印添加到头的脚本

use Josantonius\Asset\Asset;

$asset = new Asset();

echo $asset->outputHeadScripts();
use Josantonius\Asset\Facades\Asset;

echo Asset::outputHeadScripts();

打印添加的链接

use Josantonius\Asset\Asset;

$asset = new Asset();

echo $asset->outputLinks();
use Josantonius\Asset\Facades\Asset;

echo Asset::outputLinks();

完整示例

index.php

use Josantonius\Asset\Elements\Link;
use Josantonius\Asset\Elements\BodyScript;
use Josantonius\Asset\Elements\HeadScript;

new BodyScript(src: 'foo.js', async: true);
new BodyScript(src: 'bar.js', type: 'text/javascript');

new HeadScript(src: 'https://example.com/foo.js', type: 'module');
new HeadScript(src: 'https://example.com/bar.js', defer: true);

new Link(href: 'https://example.com/foo.css', rel: 'stylesheet');
new Link(href: 'https://example.com/bar.css', rel: 'stylesheet', media: 'all');

page.html

<?php
use Josantonius\Asset\Asset;
$asset = new Asset();
?>
<html>
  <head>
    <?= $asset->outputLinks() ?>
    <?= $asset->outputHeadScripts() ?>
  </head>
  <body>
    <?= $asset->outputBodyScripts() ?>
  </body>
</html>

结果

<html>
  <head>
    <link href="https://example.com/foo.css" rel="stylesheet">
    <link href="https://example.com/bar.css" rel="stylesheet" media="all">
    <script src="https://example.com/foo.js" type="module"></script>
    <script defer src="https://example.com/bar.js"></script>
  </head>
  <body>
    <script async src="foo.js"></script>
    <script src="bar.js" type="text/javascript"></script>
  </body>
</html>

使用门面的完整示例

index.php

use Josantonius\Asset\Facades\Asset;

Asset::addBodyScript(src: 'foo.js', async: true);
Asset::addBodyScript(src: 'bar.js', type: 'text/javascript');

Asset::addHeadScript(src: 'https://example.com/foo.js', type: 'module');
Asset::addHeadScript(src: 'https://example.com/bar.js', defer: true);

Asset::addLink(href: 'https://example.com/foo.css', rel: 'stylesheet');
Asset::addLink(href: 'https://example.com/bar.css', rel: 'stylesheet', media: 'all');

page.html

<?php
use Josantonius\Asset\Facades\Asset;
?>
<html>
  <head>
    <?= Asset::outputLinks() ?>
    <?= Asset::outputHeadScripts() ?>
  </head>
  <body>
    <?= Asset::outputBodyScripts() ?>
  </body>
</html>

结果

<html>
  <head>
    <link href="https://example.com/foo.css" rel="stylesheet">
    <link href="https://example.com/bar.css" rel="stylesheet" media="all">
    <script src="https://example.com/foo.js" type="module"></script>
    <script defer src="https://example.com/bar.js"></script>
  </head>
  <body>
    <script async src="foo.js"></script>
    <script src="bar.js" type="text/javascript"></script>
  </body>
</html>

测试

要运行 测试，您只需要 Composer 并执行以下操作

git clone https://github.com/josantonius/php-asset.git
cd php-asset
composer install

使用 PHPUnit 运行单元测试

composer phpunit

使用 PHPCS 运行代码标准测试

composer phpcs

运行 PHP Mess Detector 测试以检测代码风格的差异

composer phpmd

运行所有前面的测试

composer tests

待办事项

  • 添加新功能
  • 改进测试
  • 改进文档
  • 改进 README 文件中的英语翻译
  • 重构代码以禁用代码风格规则（请参阅 phpmd.xml 和 phpcs.xml）
  • 添加其他 HTML 元素
  • 添加在 <script> 标签之间添加代码的功能

变更日志

每个版本的详细更改记录在 发布说明 中。

贡献

请在提交拉取请求、开始讨论或报告问题之前，务必阅读 贡献指南。

感谢所有 贡献者！ ❤️

赞助

如果此项目帮助您减少了开发时间，您可以 赞助我 以支持我的开源工作 😊

许可

此存储库受 MIT 许可 许可。

版权所有 © 2016-至今，Josantonius