Dans cet article, vous apprendrez à utiliser l'outil de ligne de commande Artisan de Laravel et comment créer une commande personnalisée. Notez que vous devez vous familiariser avec le framework Laravel pour tirer le meilleur parti de cet article.
Dans ce tutoriel, nous allons créer une commande pour minimer nos actifs CSS, qui seront utilisés comme ceci:
<span>cssmin 'output_path' 'file1'...'fileN' --comments --concat</span>
Artisan est le nom de l'utilitaire de ligne de commande à Laravel. Il est livré avec un ensemble de commandes prédéfinies, que vous pouvez énumérer avec PHP Artisan List. Si vous souhaitez afficher l'aide pour une commande spécifique, vous pouvez utiliser la commande PHP Artisan Help.
Pour créer une commande artisan, vous pouvez utiliser la commande: faire la commande. Cette commande accepte un argument:
et trois options:
Maintenant, pour créer notre commande, nous utiliserons PHP Artisan Command: Faire CSSMinCommand --Command = CSSMinwhich créera un fichier CSSMinCommand.php dans notre répertoire APP / Commands.
<span>cssmin 'output_path' 'file1'...'fileN' --comments --concat</span>
Notre classe CSSMincommand étend le IlluminateConsoleCommand et remplace deux méthodes (getarguments, getOptions).
Remarque: les options peuvent ou non avoir des valeurs, - - Les vendeurs sont seulement un drapeau qui renvoie vrai s'il est transmis à la commande, tandis que --onupput = 'public / actifs' renvoie une valeur.
Lorsque votre commande est exécutée, la méthode de feu est appelée, c'est donc là que nous devons mettre notre logique de commande.
Si vous essayez d'exécuter notre commande php artisan cssmin 'args', vous obtiendrez une commande "cssmin" n'est pas définie.
Pour enregistrer une commande, vous devez l'ajouter au fichier artisan.php:
<span>use Illuminate<span>\Console\Command</span>;
</span><span>use Symfony<span>\Component\Console\Input\InputOption</span>;
</span><span>use Symfony<span>\Component\Console\Input\InputArgument</span>;
</span>
<span>class CssminCommand extends Command{
</span> <span>protected $name = 'cssmin';
</span> <span>protected $description = 'Command description.';
</span>
<span>public function __construct(){
</span> <span><span>parent::</span>__construct();
</span> <span>}
</span>
<span>public function fire(){
</span> <span>//
</span> <span>}
</span>
<span>protected function getArguments(){
</span> <span>return array(
</span> <span>array('example', InputArgument<span>::</span>REQUIRED, 'An example argument.'),
</span> <span>);
</span> <span>}
</span>
<span>protected function getOptions(){
</span> <span>return array(
</span> <span>array('example', null, InputOption<span>::</span>VALUE_OPTIONAL, 'An example option.', null),
</span> <span>);
</span> <span>}
</span><span>}</span>Si vous ne souhaitez pas mettre vos commandes dans le fichier artisan.php, vous pouvez créer un fichier séparé et l'inclure, ou si vous créez un package, vous pouvez les enregistrer dans votre fournisseur de services.
Dans notre méthode GetArguments, nous définirons notre sortie et nos fichiers.
Pour définir un argument, nous devons passer un tableau de valeurs:
<span>Artisan<span>::</span>add( new CssMinCommand );
</span>
<span>//or through the container
</span><span>Artisan<span>::</span>add( App<span>::</span>make("CssMinCommand") );</span>Mode: Peut avoir l'une des trois options:
Cependant, vous pouvez les combiner comme InputArgument :: is_Array | InputArgument :: requis (l'argument est requis et doit être un tableau).
donc notre méthode GetArguments sera:
<span>array( 'name', 'mode', 'description', 'defaultValue' )</span>
Remarque: Lors de l'utilisation de l'argument is_array, ce devrait être le dernier sur le tableau des arguments retournés. (évidemment).
Notre commande CSSMIN n'aura que deux options. Pour définir une option, nous passons un tableau:
<span>protected function getArguments(){
</span> <span>return array(
</span> <span>array(
</span> <span>'output',
</span> <span>InputArgument<span>::</span>REQUIRED,
</span> <span>'Path to output directory'
</span> <span>),
</span> <span>array(
</span> <span>'files',
</span> <span>InputArgument<span>::</span>IS_ARRAY | InputArgument<span>::</span>OPTIONAL ,
</span> <span>"List of css files to minify"
</span> <span>),
</span> <span>);
</span> <span>}</span>MODE: Peut être l'une des quatre options (inputOption :: value_is_array, inputOption :: value_optional, inputOption :: value_required, inputOption :: value_none), les trois premières valeurs sont similaires aux arguments.
Description: utile lors de l'impression de l'aide de la commande.
donc notre méthode GetOptions sera:
<span>cssmin 'output_path' 'file1'...'fileN' --comments --concat</span>
Lorsque notre méthode d'incendie est appelée, nous devons rassembler nos arguments et nos options. Nous pouvons faire une fonction distincte pour le faire pour nous:
<span>use Illuminate<span>\Console\Command</span>;
</span><span>use Symfony<span>\Component\Console\Input\InputOption</span>;
</span><span>use Symfony<span>\Component\Console\Input\InputArgument</span>;
</span>
<span>class CssminCommand extends Command{
</span> <span>protected $name = 'cssmin';
</span> <span>protected $description = 'Command description.';
</span>
<span>public function __construct(){
</span> <span><span>parent::</span>__construct();
</span> <span>}
</span>
<span>public function fire(){
</span> <span>//
</span> <span>}
</span>
<span>protected function getArguments(){
</span> <span>return array(
</span> <span>array('example', InputArgument<span>::</span>REQUIRED, 'An example argument.'),
</span> <span>);
</span> <span>}
</span>
<span>protected function getOptions(){
</span> <span>return array(
</span> <span>array('example', null, InputOption<span>::</span>VALUE_OPTIONAL, 'An example option.', null),
</span> <span>);
</span> <span>}
</span><span>}</span>L'argument et les méthodes d'option prennent une clé comme argument et renvoient la valeur appropriée.
Pour garder notre exemple propre et simple, nous utiliserons cette fonction simple avec une petite modification pour le processus de minification.
<span>Artisan<span>::</span>add( new CssMinCommand );
</span>
<span>//or through the container
</span><span>Artisan<span>::</span>add( App<span>::</span>make("CssMinCommand") );</span>Maintenant, pour traiter nos arguments (fichiers), nous allons faire une méthode distincte pour faire le travail.
<span>array( 'name', 'mode', 'description', 'defaultValue' )</span>
Enfin, notre méthode d'incendie n'appellera que les deux méthodes:
<span>protected function getArguments(){
</span> <span>return array(
</span> <span>array(
</span> <span>'output',
</span> <span>InputArgument<span>::</span>REQUIRED,
</span> <span>'Path to output directory'
</span> <span>),
</span> <span>array(
</span> <span>'files',
</span> <span>InputArgument<span>::</span>IS_ARRAY | InputArgument<span>::</span>OPTIONAL ,
</span> <span>"List of css files to minify"
</span> <span>),
</span> <span>);
</span> <span>}</span>Astuce: vous pouvez également exécuter une commande externe à l'aide de la méthode d'appel.
<span>array('name', 'shortcut', 'mode', 'description', 'defaultValue')</span>Pour tester notre commande, nous allons copier certains fichiers CSS dans notre répertoire public / CSS, puis exécuter la commande.
<span>protected function getOptions(){
</span> <span>return array(
</span> <span>array('comments', 'c', InputOption<span>::</span>VALUE_NONE, 'Don\'t strip comments' , null),
</span> <span>array('concat', null, InputOption<span>::</span>VALUE_NONE, 'Concat the minified result to one file' , null),
</span> <span>);
</span> <span>}</span>La première commande créera deux fichiers (style.min.css, Reactive.min.css) sur le répertoire public / css.
Parce que nous avons utilisé les - Comements et les indicateurs - CONCAT, nous allons obtenir un fichier appelé all.min.css contenant les deux fichiers avec des commentaires laissés.
Notre commande n'est pas très descriptive et ne donne aucun message ou notifications!
Avant de continuer, sur le référentiel GitHub final, je créerai une nouvelle balise pour notre commande afin que vous puissiez changer et tester chacun.
Pour rendre la commande un peu verbeuse, Laravel nous fournit certaines fonctions de sortie:
<span>private function init(){
</span> <span>// retrun an array
</span> <span>$this->files = $this->argument('files');
</span> <span>// return a string
</span> <span>$this->output_path = $this->argument('output');
</span> <span>// return true if passed, otherwise false
</span> <span>$this->comments = $this->option('comments');
</span> <span>// return true if passed, otherwise false
</span> <span>$this->concat = $this->option('concat');
</span><span>}</span>Ceci sera sorti:
à côté de simplement afficher des messages, vous pouvez demander des informations à l'utilisateur, ex:
<span>private function minify( $css, $comments ){
</span> <span>// Normalize whitespace
</span> <span>$css = preg_replace( '/\s+/', ' ', $css );
</span>
<span>// Remove comment blocks, everything between /* and */, unless preserved with /*! ... */
</span> <span>if( !$comments ){
</span> <span>$css = preg_replace( '/\/\*[^\!](.*?)\*\//', '', $css );
</span> <span>}//if
</span>
<span>// Remove ; before }
</span> <span>$css = preg_replace( '/;(?=\s*})/', '', $css );
</span>
<span>// Remove space after , : ; { } */ >
</span> <span>$css = preg_replace( '/(,|:|;|\{|}|\*\/|>) /', '', $css );
</span>
<span>// Remove space before , ; { } ( ) >
</span> <span>$css = preg_replace( '/ (,|;|\{|}|\(|\)|>)/', '', $css );
</span>
<span>// Strips leading 0 on decimal values (converts 0.5px into .5px)
</span> <span>$css = preg_replace( '/(:| )0\.([0-9]+)(%|em|ex|px|in|cm|mm|pt|pc)/i', '.', $css );
</span>
<span>// Strips units if value is 0 (converts 0px to 0)
</span> <span>$css = preg_replace( '/(:| )(\.?)0(%|em|ex|px|in|cm|mm|pt|pc)/i', '0', $css );
</span>
<span>// Converts all zeros value into short-hand
</span> <span>$css = preg_replace( '/0 0 0 0/', '0', $css );
</span>
<span>// Shortern 6-character hex color codes to 3-character where possible
</span> <span>$css = preg_replace( '/#([a-f0-9])\1([a-f0-9])\2([a-f0-9])\3/i', '#', $css );
</span>
<span>return trim( $css );
</span> <span>}//minify</span>La méthode de confirmation prend deux arguments, un message de question et une valeur par défaut si l'utilisateur tape quelque chose de différent de Y / N.
La méthode de demande demandera à l'utilisateur une entrée au lieu de simplement O / N, et si elle est laissée vide, la valeur par défaut est renvoyée.
La méthode de choix donnera à l'utilisateur une liste numérotée à choisir, et si elle est laissée vide, la valeur par défaut est renvoyée.
La méthode secrète invitera l'utilisateur avec une question et masquera la saisie, mais l'entrée de l'utilisateur sera renvoyée.
En fait, Laravel ne fait que rendre l'API de la console de Symfony et plus verbeux, et il y a tellement plus si vous voulez creuser.
Rendons notre commande plus verbeuse et maintenons l'utilisateur à jour sur les tâches effectuées.
<span>private function processFiles(){
</span> <span>// array of minified css
</span> <span>$css_result = [];
</span>
<span>foreach ( $this->files as $file ) {
</span> <span>//read file content
</span> <span>$file_content = file_get_contents( $file );
</span> <span>//minify CSS and add it to the result array
</span> <span>$css_result[] = $this->minify( $file_content, $this->comments );
</span> <span>}//foreach
</span>
<span>// if the concat flag is true
</span> <span>if( $this->concat ){
</span> <span>// join the array of minified css
</span> <span>$css_concat = implode( PHP_EOL, $css_result );
</span> <span>// save to file
</span> <span>file_put_contents($this->output_path . '/all.min.css', $css_concat);
</span> <span>}//if
</span> <span>else{
</span> <span>foreach ($css_result as $key => $css) {
</span> <span>//remove '.css' to add '.min.css'
</span> <span>$filename = basename( $this->files[$key], '.css' ) . '.min.css';
</span> <span>// save to file
</span> <span>file_put_contents($this->output_path . '/' . $filename, $css);
</span> <span>}//for
</span> <span>}//else
</span>
<span>}//processFiles</span>Notre fonction imprime désormais quelques messages utiles pour garder une trace de ce qui se passe.
Remarque: ce sera étiqueté comme v2 de notre commande sur le référentiel github.
Lors de la création d'une application, nous avons l'habitude de vider la liste des routes disponibles (routes artisanales PHP).
Symfony fournit une fonction qui vous permet d'imprimer facilement un tel tableau. Vérifiez la documentation pour un exemple. Nous verrons ensuite comment nous pouvons utiliser certains aides à la console Symfony.
Pour illustrer l'utilisation de certains aides à symfony, nous utiliserons l'assistant de progression pour maintenir l'utilisateur à jour sur la progression de l'emploi.
À la fin de notre méthode init, nous aurons besoin d'une progression de The Helerset, puis de démarrer notre barre de progression.
<span>cssmin 'output_path' 'file1'...'fileN' --comments --concat</span>
La méthode de démarrage accepte deux arguments, $ this-> la sortie est une instance consoleouput de la console Symfony. Le deuxième argument est le nombre maximum d'étapes.
Chaque fois que nous traitons un fichier dans notre méthode ProcessFiles, nous ferons progresser la barre de progression d'une étape, et lorsque le travail sera terminé, nous terminerons la barre de progression et imprimerons un message de notification.
<span>use Illuminate<span>\Console\Command</span>;
</span><span>use Symfony<span>\Component\Console\Input\InputOption</span>;
</span><span>use Symfony<span>\Component\Console\Input\InputArgument</span>;
</span>
<span>class CssminCommand extends Command{
</span> <span>protected $name = 'cssmin';
</span> <span>protected $description = 'Command description.';
</span>
<span>public function __construct(){
</span> <span><span>parent::</span>__construct();
</span> <span>}
</span>
<span>public function fire(){
</span> <span>//
</span> <span>}
</span>
<span>protected function getArguments(){
</span> <span>return array(
</span> <span>array('example', InputArgument<span>::</span>REQUIRED, 'An example argument.'),
</span> <span>);
</span> <span>}
</span>
<span>protected function getOptions(){
</span> <span>return array(
</span> <span>array('example', null, InputOption<span>::</span>VALUE_OPTIONAL, 'An example option.', null),
</span> <span>);
</span> <span>}
</span><span>}</span>Vous pouvez essayer la commande avec plusieurs fichiers ou décommenter la ligne de fonction de sommeil pour voir un effet en direct.
Remarque: cette version sera taguée sous forme de v3 sur le référentiel final.
Dans cet article, nous avons appris comment créer et étendre les commandes Laravel. Laravel a beaucoup de commandes intégrées que vous pouvez explorer, et vous pouvez également vérifier notre référentiel final sur GitHub pour tester le résultat final. Questions? Commentaires? Souhaitez-vous voir plus de tutoriels de commande artisanale? Faites-nous savoir!
Minification CSS dans Laravel est une étape cruciale dans l'optimisation de votre site Web ou de votre application. Cela implique le processus de suppression des caractères inutiles tels que des espaces, des commentaires et des pauses de ligne des fichiers CSS. Ce processus réduit la taille des fichiers CSS, qui à son tour réduit la quantité de données qui doivent être transférées au client. Cela peut améliorer considérablement le temps de chargement de votre site Web ou de votre application, offrant une meilleure expérience utilisateur.
Laravel Le mélange est un outil puissant qui fournit une couramment API pour définir des étapes de construction WebPack pour votre application Laravel. Il prend en charge plusieurs pré-processeurs CSS et JavaScript communs, y compris la minification. En utilisant Laravel Mix, vous pouvez facilement réduire vos fichiers CSS avec une seule commande, sans avoir à supprimer manuellement les caractères inutiles. Cela fait non seulement gagner du temps, mais garantit également que vos fichiers CSS sont aussi optimisés que possible.
Oui, vous pouvez minifiliser les fichiers CSS sans utiliser Laravel Mélanger. Il existe plusieurs outils en ligne et packages NPM disponibles qui peuvent vous aider à réduire vos fichiers CSS. Cependant, l'utilisation de Laravel Mix est recommandée car elle s'intègre parfaitement à Laravel et fournit un moyen simple et pratique de gérer et d'optimiser vos fichiers CSS.
Bien que la mini-montée CSS dans Laravel soit généralement un processus simple, vous pourriez rencontrer des problèmes si vos fichiers CSS contiennent des erreurs de syntaxe. Ces erreurs peuvent entraîner l'échec du processus de minification, ce qui entraîne des fichiers CSS non optimisés. Par conséquent, il est important de s'assurer que vos fichiers CSS sont sans erreur avant d'essayer de les minimer.
Si vous rencontrez des problèmes pendant la minification CSS Dans Laravel, vous pouvez utiliser la fonctionnalité Source Maps de Laravel Mix pour les déboguer. Les cartes source sont des fichiers qui mappent les fichiers CSS minifiés dans les fichiers source d'origine, vous permettant de tracer et de résoudre facilement les problèmes.
Oui, vous pouvez automatiser le processus de minification CSS à Laravel en utilisant la fonction de versioning de Laravel Mix. Cette fonctionnalité diminue automatiquement vos fichiers CSS chaque fois que vous exécutez la commande de production de production. Cela garantit que vos fichiers CSS sont toujours optimisés, sans avoir à les minimer manuellement à chaque fois.
Minification CSS peut-elle améliorer considérablement les performances de votre application Laravel. En réduisant la taille de vos fichiers CSS, vous pouvez réduire la quantité de données qui doivent être transférées au client. Cela peut entraîner des temps de chargement plus rapides, offrant une meilleure expérience utilisateur.
Quelle est la différence entre les fichiers CSS minimisation et concaténer?
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!
Puis-je récupérer une courte vidéo Douyin supprimée ?
Que dois-je faire si chaturbate est bloqué ?
Introduction à l'utilisation de Rowid dans Oracle
Logiciel d'évaluation de serveur
La connexion à distance mstsc a échoué
Quelles sont les méthodes de création d'un site Web mobile ?
Comment obtenir l'heure actuelle en JAVA
Que faire si l'utilisation de la mémoire est trop élevée
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
