如何创建Laravel CSS-Minify命令-php教程-PHP中文网

钥匙要点

在Laravel中缩小CSS的目的是什么？它涉及删除不必要的字符，例如从CSS文件中的空格，评论和线路中断。此过程减少了CSS文件的大小，这又减少了需要传输给客户端的数据量。这可以显着改善您的网站或应用程序的负载时间，提供更好的用户体验。

如果在CSS Minification期间遇到问题，我如何在CSS Minification in Laravel中的CSS Minification中调试问题？在Laravel中，您可以使用Laravel Mix的源地图功能进行调试。源地图是将缩小的CSS文件映射回原始源文件的文件，使您可以轻松地跟踪和解决任何问题。

css Minification可以显着提高性能您的Laravel申请。通过减少CSS文件的大小，您可以减少需要传输到客户端的数据量。这可能会导致加载时间更快，提供更好的用户体验。

>缩放和串联CSS文件之间有什么区别？不必要的字符降低大小，同时串联CSS文件涉及将多个CSS文件组合到一个文件中。这两个过程都可以帮助优化您的Laravel应用程序，但它们的目的不同。缩小缩小每个单独的CSS文件的大小，同时通过将多个文件组合到一个。

首页

后端开发

php教程

如何创建Laravel CSS-Minify命令

Joseph Gordon-Levitt

Feb 21, 2025 am 08:30 AM

如何创建Laravel CSS-Minify命令

>在本文中，您将学习如何使用Laravel的Artisan命令行工具以及如何创建自定义命令。请注意，您需要熟悉Laravel框架才能充分利用本文。

钥匙要点

利用Laravel Artisan：利用Laravel的Artisan命令行工具为CSS Minification创建自定义命令，提高了Web开发项目的工作流效率。
>自定义命令创建：轻松地使用`php工匠命令：用命名，存储和命名区的选项创建自定义命令，允许在Laravel应用程序中量身定制功能。
缩小选项：在您的命令中实现选项来处理CSS文件串联和评论保存，提供了基于不同开发需求的灵活性。
命令注册：确保在Laravel的Artisan系统中注册您的新命令，以使其可执行，无论是通过'artisan.php`文件还是用于包装开发的服务提供商。
执行和输出：使用命令来缩小CSS文件，并具有可选的串联和注释保存标志，并在执行过程中提高命令反馈。

我们在建造什么

在本教程中，我们将构建一个命令来缩小我们的CSS资产，将其使用：

<span>cssmin 'output_path' 'file1'...'fileN' --comments --concat</span>

登录后复制

output_path ：（必需）保存缩小文件的路径，（style.css-> style.min.css）。

file1 ... fileen ：（必需）要缩小的文件列表。
- 注释：（可选）添加此选项以保持注释。
- concat ：（可选）将缩小文件串成一个名为all.min.css的文件
什么是laravel命令

创建CSS minifier命令

要创建一个工匠命令，您可以使用命令：make命令。此命令接受一个参数：

>名称：命令的类名称。

和三个选项：

- 路径：默认情况下，命令存储在应用程序/命令文件夹中，但是，您可以使用此选项更改该命令。

- 名称空间：您可以使用此选项来命名您的一组命令，例如在命令命令中：make，make命令在命令名称空间下。

>>>>>>>>>>
cssmin 'output_path' 'file1'...'fileN' --comments --concat
登录后复制
登录后复制
登录后复制
登录后复制
我们的cssmincommand类扩展了IlluminateConsolecommand并覆盖两种方法（getArguments，getOptions）。
>
- > getArguments：此功能返回应该传递给命令的一系列参数（例如：我们传递给CSSMIN命令的文件列表）。
注意：选项可能具有或可能没有值， - comments只是一个标志，如果将其传递给命令，则返回true，而-ouptput ='public/public/Assets'将返回一个值。
>
执行您的命令时，将调用火法，因此我们需要放置命令逻辑。

注册命令

如果您尝试运行我们的命令PHP Artisan cssmin'Args'您将获得命令“ CSSMIN”。
要注册一个命令，您需要将其添加到artisan.php文件：
>

>如果您不想将命令放入artisan.php文件中，则可以创建一个单独的文件并包含它，或者如果您创建一个软件包，则可以在服务提供商中注册。
参数
在我们的getArguments方法中，我们将定义输出和文件。
use Illuminate\Console\Command; use Symfony\Component\Console\Input\InputOption; use Symfony\Component\Console\Input\InputArgument; class CssminCommand extends Command{ protected $name = 'cssmin'; protected $description = 'Command description.'; public function __construct(){ parent::__construct(); } public function fire(){ // } protected function getArguments(){ return array( array('example', InputArgument::REQUIRED, 'An example argument.'), ); } protected function getOptions(){ return array( array('example', null, InputOption::VALUE_OPTIONAL, 'An example option.', null), ); } }
登录后复制
登录后复制
登录后复制
要定义一个参数，我们需要传递一系列值：
名称：检索参数时要使用的密钥名称。
>

模式：可以具有三个选项之一：
>
Artisan::add( new CssMinCommand ); //or through the container Artisan::add( App::make("CssMinCommand") );
登录后复制
登录后复制
- Inputargument ::可选：参数是可选的。
- inputargument :: is_array：参数接受多个值（ex：file1 ... fileen）。
 但是，您可以将它们结合起来，例如Inputargument :: iS_array | InputArgument ::必需（必需参数，必须是一个数组）。
 
 >
 >描述：打印命令帮助时有用。
 
 > defaultValue：如果未提供参数。
 >
 
 ，所以我们的getArguments方法将是：
 >
array( 'name', 'mode', 'description', 'defaultValue' )
登录后复制
登录后复制
>名称：您选项的名称（例如：注释）。
>
快捷方式：您选项的较短版本（例如： - Verbose和-v）。
>

模式：可以是四个选项之一（inputoption :: value_is_array，inputoption :: value_optional，inputoption :: value_required，inputoption :: value_none），前三个值与参数相似。
protected function getArguments(){ return array( array( 'output', InputArgument::REQUIRED, 'Path to output directory' ), array( 'files', InputArgument::IS_ARRAY | InputArgument::OPTIONAL , "List of css files to minify" ), ); }
登录后复制
登录后复制
value_none：指示该选项是布尔旗（ex： - verbose）。
- 描述：在打印命令帮助时有用。
- >
- >
 
 ，所以我们的getOptions方法将是：
 >
 
 cssmin 'output_path' 'file1'...'fileN' --comments --concat
 登录后复制
 登录后复制
 登录后复制
 登录后复制
 
 >运行命令
 
 当我们的火法被称为时，我们需要收集我们的论点和选择。我们可以单独的功能为我们做到这一点：
 >
 use Illuminate\Console\Command; use Symfony\Component\Console\Input\InputOption; use Symfony\Component\Console\Input\InputArgument; class CssminCommand extends Command{ protected $name = 'cssmin'; protected $description = 'Command description.'; public function __construct(){ parent::__construct(); } public function fire(){ // } protected function getArguments(){ return array( array('example', InputArgument::REQUIRED, 'An example argument.'), ); } protected function getOptions(){ return array( array('example', null, InputOption::VALUE_OPTIONAL, 'An example option.', null), ); } }
 登录后复制
 登录后复制
 登录后复制
 
 参数和选项方法以键作为参数并返回适当的值。>
 为了保持我们的示例清洁和简单，我们将使用此简单功能和小的修改来进行缩小过程。
 
 Artisan::add( new CssMinCommand ); //or through the container Artisan::add( App::make("CssMinCommand") );
 登录后复制
 登录后复制
 现在要处理我们的参数（文件），我们将制作一个单独的方法来完成这项工作。>
 
 >最后，我们的火法只会调用这两种方法：>
 array( 'name', 'mode', 'description', 'defaultValue' )
 登录后复制
 登录后复制
 
 提示：您也可以使用呼叫方法运行外部命令。>
 
 protected function getArguments(){ return array( array( 'output', InputArgument::REQUIRED, 'Path to output directory' ), array( 'files', InputArgument::IS_ARRAY | InputArgument::OPTIONAL , "List of css files to minify" ), ); }
 登录后复制
 登录后复制
 要测试我们的命令，我们将将一些CSS文件复制到我们的public/css目录中，然后运行命令。
 
 第一个命令将在public/css目录上创建两个文件（style.min.css，willsive.min.css）。
 array('name', 'shortcut', 'mode', 'description', 'defaultValue')
 登录后复制
 >
 因为我们使用了 - comments和 - concat标志，所以我们将获得一个名为all.min.css的文件，其中包含两个文件，其中剩下的两个文件。
 >
 protected function getOptions(){ return array( array('comments', 'c', InputOption::VALUE_NONE, 'Don\'t strip comments' , null), array('concat', null, InputOption::VALUE_NONE, 'Concat the minified result to one file' , null), ); }
 登录后复制
 我们的命令不是很描述性，也不提供任何消息或通知！
 >
 改进命令
 在我们继续之前，在最终的github存储库之前，我将为我们的命令创建一个新标签，以便您可以切换和测试每个标签。
 使命令有点冗长，Laravel为我们提供了一些输出功能：
 
 这将输出：
 
 在仅显示消息之外，您可以向用户询问信息，例如：>
 
 private function init(){ // retrun an array $this->files = $this->argument('files'); // return a string $this->output_path = $this->argument('output'); // return true if passed, otherwise false $this->comments = $this->option('comments'); // return true if passed, otherwise false $this->concat = $this->option('concat'); }
 登录后复制
 如果用户类型与y/n。
 >
 询问方法将向用户询问输入，而不仅仅是y/n，如果将其留为空，则返回默认值。
 >选择方法将为用户提供一个编号列表以供您选择，如果将其剩下，则返回默认值。
 >
 秘密方法将提示用户提出问题并隐藏键入，但是将返回用户输入。
 
 private function minify( $css, $comments ){ // Normalize whitespace $css = preg_replace( '/\s+/', ' ', $css ); // Remove comment blocks, everything between /* and */, unless preserved with /*! ... */ if( !$comments ){ $css = preg_replace( '/\/\*[^\!](.*?)\*\//', '', $css ); }//if // Remove ; before } $css = preg_replace( '/;(?=\s*})/', '', $css ); // Remove space after , : ; { } */ > $css = preg_replace( '/(,|:|;|\{|}|\*\/|>) /', '', $css ); // Remove space before , ; { } ( ) > $css = preg_replace( '/ (,|;|\{|}|$|$|>)/', '', $css ); // Strips leading 0 on decimal values (converts 0.5px into .5px) $css = preg_replace( '/(:| )0\.([0-9]+)(%|em|ex|px|in|cm|mm|pt|pc)/i', '.', $css ); // Strips units if value is 0 (converts 0px to 0) $css = preg_replace( '/(:| )(\.?)0(%|em|ex|px|in|cm|mm|pt|pc)/i', '0', $css ); // Converts all zeros value into short-hand $css = preg_replace( '/0 0 0 0/', '0', $css ); // Shortern 6-character hex color codes to 3-character where possible $css = preg_replace( '/#([a-f0-9])\1([a-f0-9])\2([a-f0-9])\3/i', '#', $css ); return trim( $css ); }//minify
 登录后复制
 实际上，Laravel只是使Symfony的游戏机API更简单，更详细，如果您想挖进去，还有更多。
 >
 >让我们的命令更加详细，并使用户对执行的任务进行更新。>
 
 我们的功能现在打印一些有用的消息，以跟踪正在发生的事情。>
 
 注意：这将在GitHub存储库上标记为我们命令的V2。
 创建应用程序时，我们被用来倾倒可用路由的列表（PHP Artisan路线）。
 
 Symfony提供了一个函数，可让您轻松打印这样的桌子。检查文档中的示例。我们将看到接下来如何使用一些Symfony控制台助手。
 >
 使用Symfony Console Helper
 为了说明某些符号助手的使用，我们将使用进度助手来保持用户有关工作进度的最新信息。
 在我们的初始方法结束时，我们将需要从助手那里取得进度，然后开始我们的进度标准。
 
 启动方法接受两个参数，$ this->输出是Symfony控制台中的consoleouput实例。第二个参数是最大步骤数。
 >
 
 cssmin 'output_path' 'file1'...'fileN' --comments --concat
 登录后复制
 登录后复制
 登录后复制
 登录后复制
 >每次我们在processFiles方法中处理文件时，我们都会将进度栏推进一步，当作业完成时，我们将结束进度栏并打印通知消息。
 
 >您可以尝试使用多个文件的命令或删除睡眠功能线以查看实时效果。
 
 use Illuminate\Console\Command; use Symfony\Component\Console\Input\InputOption; use Symfony\Component\Console\Input\InputArgument; class CssminCommand extends Command{ protected $name = 'cssmin'; protected $description = 'Command description.'; public function __construct(){ parent::__construct(); } public function fire(){ // } protected function getArguments(){ return array( array('example', InputArgument::REQUIRED, 'An example argument.'), ); } protected function getOptions(){ return array( array('example', null, InputOption::VALUE_OPTIONAL, 'An example option.', null), ); } }
 登录后复制
 登录后复制
 登录后复制
 
 注意：此版本将在最终存储库上标记为V3。
 结论在本文中，我们了解了如何创建和扩展Laravel命令。 Laravel有很多可以探索的内置命令，您还可以检查我们在Github上的最终存储库以测试最终结果。问题？评论？您想查看更多工匠司令部教程吗？让我们知道！
 
 Laravel CSS Minify Command
 上的常见问题（常见问题解答）
 在Laravel中缩小CSS的目的是什么？它涉及删除不必要的字符，例如从CSS文件中的空格，评论和线路中断。此过程减少了CSS文件的大小，这又减少了需要传输给客户端的数据量。这可以显着改善您的网站或应用程序的负载时间，提供更好的用户体验。
 
 > Laravel Mix如何帮助CSS Minification？
 
 Laravel Mix是一种功能强大的工具，可提供流利的工具用于定义WebPack的API为您的Laravel应用程序构建步骤。它支持几个常见的CSS和JavaScript前处理器，包括缩小。通过使用Laravel Mix，您可以轻松地使用单个命令来缩小CSS文件，而无需手动删除不必要的字符。这不仅节省了时间，而且还可以确保您的CSS文件尽可能优化。
 我可以在不使用laravel mix的情况下缩小CSS文件吗？
 是的，您可以在不使用laravel的情况下缩小CSS文件混合。有几种在线工具和NPM软件包可以帮助您缩小CSS文件。但是，建议使用Laravel Mix，因为它与Laravel无缝集成，并提供了一种简单便捷的方法来管理和优化您的CSS文件。
 >
 >在Laravel中缩小CSS时可能会遇到的潜在问题？
 
 > >在Laravel中缩小CSS通常是一个简单的过程，如果您的CSS文件包含语法错误，您可能会遇到问题。这些错误会导致缩小过程失败，从而导致不优化的CSS文件。因此，重要的是要确保您的CSS文件在尝试缩小它们之前是无错误的。
 
 如果在CSS Minification期间遇到问题，我如何在CSS Minification in Laravel中的CSS Minification中调试问题？在Laravel中，您可以使用Laravel Mix的源地图功能进行调试。源地图是将缩小的CSS文件映射回原始源文件的文件，使您可以轻松地跟踪和解决任何问题。
 
 我可以在Laravel中自动化CSS Minification的过程？是的，您可以使用Laravel Mix的版本控制功能来自动化Laravel中CSS缩小的过程。每当您运行生产构建命令时，此功能都会自动减小CSS文件。这样可以确保您的CSS文件始终得到优化，而无需每次手动缩小它们。
 
 > CSS Minification如何影响我的Laravel应用程序的性能？
 
 css Minification可以显着提高性能您的Laravel申请。通过减少CSS文件的大小，您可以减少需要传输到客户端的数据量。这可能会导致加载时间更快，提供更好的用户体验。
 
 >我可以使用Laravel Mix缩小其他类型的文件吗？
 是的，除了CSS文件，也可以使用Laravel Mix缩小JavaScript文件。这可以进一步优化您的Laravel应用程序，减少需要将需要传输到客户端的数据量。
 >缩放和串联CSS文件之间有什么区别？不必要的字符降低大小，同时串联CSS文件涉及将多个CSS文件组合到一个文件中。这两个过程都可以帮助优化您的Laravel应用程序，但它们的目的不同。缩小缩小每个单独的CSS文件的大小，同时通过将多个文件组合到一个。
 
 >我如何确保如何正确提供我的CSS文件？为了确保正确提供了缩小的CSS文件，您可以使用Laravel Mix的版本操作功能。此功能将唯一的哈希附加到您缩小的CSS文件的文件名上，以确保客户端始终接收您的CSS文件的最新版本。