aelora/js-css-queue

用于排队 JavaScript 和 CSS 文件的 PHP 包

dev-master 2019-10-21 01:39 UTC

This package is auto-updated.

Last update: 2024-09-21 20:44:08 UTC


README

用于注册和排队 JavaScript 和 CSS 文件的 PHP 包。

安装

composer require aelora/js-css-queue

使用方法

这两个类具有相同的方法集。在几乎所有情况下,下面的 \Aelora\JS::method 示例调用都有一个相应的 \Aelora\CSS::methodCSS 类中。

注册文件

\Aelora\JS::register($url, $name='', $version=false, $dependencies=[], $attributes=[]);
\Aelora\CSS::register($url, $name='', $version=false, $dependencies=[], $attributes=[]);

排队文件

对于排队 scriptstyle,您有两个选项。

如果您只需要排队一个 URL,您可以将它传递给 enqueue 方法。

\Aelora\JS::enqueue('https://code.jqueryjs.cn/jquery-2.2.4.min.js');

使用此行将完整 URL 排队以输出。这样做您将失去此包处理依赖的能力。

更好的选项是注册脚本或样式,然后在需要使用它时排队。

\Aelora\JS::register('jquery', 'https://code.jqueryjs.cn/jquery-2.2.4.min.js');
\Aelora\JS::enqueue('jquery'); 

当脚本或样式被排队时,任何依赖也会被排队。

写入 HTML

在您的文档头部,您将调用这两个类的 write() 方法。

<html>
    <head>
        <title>My Page</title>
        <?php \Aelora\JS::write(); ?>
        <?php \Aelora\CSS::write(); ?>
    </head>
</html>

这将输出所有您排队的脚本和样式标签所链接的文件。

如果您使用 Blade 模板,您可以使用它像这样。

<html>
    <head>
        <title>My Page</title>
        {{ \Aelora\JS::write() }}
        {{ \Aelora\CSS::write() }}
    </head>
</html>

解排队

如果您在队列中有某些东西不想在特定视图中使用,您可以使用 dequeue 方法。

\Aelora\JS::dequeue('jquery'); 

清除

如果您需要清除已注册的脚本、样式和队列。

\Aelora\JS::clear();
\Aelora\CSS::clear(); 

重置

这将从配置文件重新加载类的新数据,或者如果您不提供配置文件,将回退到默认值。

\Aelora\JS::reset('/path/to/config/file.php'); 	// Uses new file
\Aelora\JS::reset();							// Uses default config 

这两个类都有一个 reset 方法,但只有 JS 中的 reset 才会实际重置和重新加载。CSS 类中的 reset 仅清除 CSS 的注册和队列,不会重新加载。JS 中的 reset 方法清除两个类并重新加载。

配置文件

您可以在启动脚本中注册和排队大量文件,也可以使用配置文件。

<?php

return [
    /* Scripts and styles to register.
     * 
     * This doesn't actually put them onto pages. You also have to
     * either globally enqueue this using this file or enqueue them
     * before your view is rendered. 
     */
    'register' => [
        'js' => [            
        ],
        'css' => [
        ]
    ],
    /* Enqueue any styles and scripts, by their handle, that should
     * be included on all pages. 
     */
    'enqueue' => [
        'js' => [
        ],
        'css' => [
        ]
    ]
];

register 部分是您添加脚本或样式到注册集的地方,您有两个选项。

第一个是如果您只想传递一个 URL。

'register' => [
    'jquery' => 'https://code.jqueryjs.cn/jquery-2.2.4.min.js'
]

这将注册一个名为 jquery 的脚本,并使用该 URL;但不会有版本、任何依赖或属性。如果您想包含任何这些,请使用数组。

'register' => [
    'jquery' => [
        'url' => 'https://code.jqueryjs.cn/jquery-2.2.4.min.js',
        'version' => '2.2.4',
        'dependencies' => [],
        'attributes' => []
    ]
]

URL 是数组中唯一必需的元素,但如果您只使用它,您可以使用上面的更短字符串方法。

要自动排队脚本或样式,请将它们包含在排队部分。jscss 都是包含名称的数组。

'enqueue' => [
    'js' => ['jquery', 'bootstrap'],
    'css' => ['bootstrap', 'default-css']
]

您在这里排队的任何内容都应该也在注册部分。

配置文件位置

如果您想指定配置文件的位置,您可以使用 configFile 属性。

\Aelora\JS::$configFile = '/path/to/config.php';

如果您没有指定 $configFile,此包将按以下顺序在此处查找它。

  1. 如果存在一个名为 config_path 的函数(Laravel)且该路径中存在 jscssqueue.php 文件,它将使用该文件。
  2. 它将在此包中 JS.phpCSS.php 文件相同的文件夹中查找名为 jscssqueue.php 的文件。

如果都没有找到,它将从一个空的注册集和一个空的队列开始。