Maison cadre php Laravel Développement Laravel : Comment compiler des actifs front-end à l'aide de Laravel Mix ?

Développement Laravel : Comment compiler des actifs front-end à l'aide de Laravel Mix ?

Jun 13, 2023 am 11:21 AM
laravel mix 前端资产。

Laravel est un framework PHP très populaire. Ses fonctions puissantes et son architecture flexible ont attiré l'attention de nombreux développeurs. Parmi eux, Laravel Mix est un puissant outil frontal de Laravel, qui peut nous aider à traiter plus facilement les ressources frontales. Alors, comment compiler des actifs front-end à l’aide de Laravel Mix ? Ensuite, nous présenterons en détail comment utiliser Laravel Mix.

  1. Installer Laravel Mix dans Laravel

Tout d'abord, nous devons installer Laravel Mix dans Laravel. Nous pouvons utiliser la commande suivante pour installer :

npm install --save-dev laravel-mix
Copier après la connexion

Cette commande installera Laravel Mix dans le projet.

  1. Écrivez le fichier Webpack.mix.js

Après avoir installé Laravel Mix, nous devons écrire le fichier Webpack.mix.js. Ce fichier contient les tâches et paramètres que nous souhaitons exécuter, tels que les fichiers JS et CSS que nous souhaitons compiler, les plugins utilisés, le répertoire de sortie, etc.

Nous créons un nouveau fichier Webpack.mix.js et écrivons le contenu suivant :

let mix = require('laravel-mix');

mix.js('resources/js/app.js', 'public/js')
   .sass('resources/sass/app.scss', 'public/css');
Copier après la connexion

Ici, nous utilisons JavaScript et SASS, deux langages de programmation front-end. Nous pouvons le modifier en fonction des besoins réels.

  1. Exécutez la commande de compilation

Après avoir écrit le fichier Webpack.mix.js, nous pouvons exécuter la commande de compilation. Nous pouvons utiliser la commande suivante pour exécuter la compilation :

npm run dev
Copier après la connexion

Cette commande compilera automatiquement les ressources que nous avons configurées, y compris les fichiers JavaScript et SASS.

  1. Options de compilation supplémentaires

Laravel Mix prend également en charge de nombreuses options de compilation supplémentaires. Par exemple, nous pouvons utiliser la commande suivante pour surveiller automatiquement les modifications dans tous les fichiers et les compiler en temps réel :

npm run watch
Copier après la connexion

De plus, nous pouvons également utiliser la commande suivante pour empaqueter le code :

npm run production
Copier après la connexion

Cela effectuera une compilation et une compression au niveau de la production de toutes les ressources pour améliorer les performances et la vitesse de chargement de votre site Web.

Résumé

Dans cet article, nous avons présenté comment compiler des actifs frontaux dans Laravel à l'aide de Laravel Mix. Laravel Mix fournit des outils très pratiques pour gérer les ressources front-end, réduisant ainsi notre charge de travail front-end. J'espère que cet article pourra aider tout le monde à mieux utiliser Laravel Mix.

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!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

AI Hentai Generator

AI Hentai Generator

Générez AI Hentai gratuitement.

Article chaud

R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
2 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Repo: Comment relancer ses coéquipiers
1 Il y a quelques mois By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Comment obtenir des graines géantes
4 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Combien de temps faut-il pour battre Split Fiction?
3 Il y a quelques semaines By DDD

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Comment utiliser le mappage objet-relationnel (ORM) en PHP pour simplifier les opérations de base de données ? Comment utiliser le mappage objet-relationnel (ORM) en PHP pour simplifier les opérations de base de données ? May 07, 2024 am 08:39 AM

Les opérations de base de données en PHP sont simplifiées à l'aide d'ORM, qui mappe les objets dans des bases de données relationnelles. EloquentORM dans Laravel vous permet d'interagir avec la base de données en utilisant une syntaxe orientée objet. Vous pouvez utiliser ORM en définissant des classes de modèle, en utilisant des méthodes Eloquent ou en créant un système de blog dans la pratique.

Analyse des avantages et inconvénients des outils de tests unitaires PHP Analyse des avantages et inconvénients des outils de tests unitaires PHP May 06, 2024 pm 10:51 PM

Analyse de l'outil de test unitaire PHP : PHPUnit : convient aux grands projets, fournit des fonctionnalités complètes et est facile à installer, mais peut être verbeux et lent. PHPUnitWrapper : adapté aux petits projets, facile à utiliser, optimisé pour Lumen/Laravel, mais a des fonctionnalités limitées, ne fournit pas d'analyse de couverture de code et dispose d'un support communautaire limité.

Laravel - Commandes artisanales Laravel - Commandes artisanales Aug 27, 2024 am 10:51 AM

Laravel - Artisan Commands - Laravel 5.7 est livré avec une nouvelle façon de traiter et de tester de nouvelles commandes. Il inclut une nouvelle fonctionnalité de test des commandes artisanales et la démonstration est mentionnée ci-dessous ?

Comparaison des dernières versions de Laravel et CodeIgniter Comparaison des dernières versions de Laravel et CodeIgniter Jun 05, 2024 pm 05:29 PM

Les dernières versions de Laravel 9 et CodeIgniter 4 fournissent des fonctionnalités et des améliorations mises à jour. Laravel9 adopte l'architecture MVC et fournit des fonctions telles que la migration de bases de données, l'authentification et le moteur de modèles. CodeIgniter4 utilise l'architecture HMVC pour fournir le routage, l'ORM et la mise en cache. En termes de performances, le modèle de conception basé sur le fournisseur de services de Laravel9 et le framework léger de CodeIgniter4 lui confèrent d'excellentes performances. Dans les applications pratiques, Laravel9 convient aux projets complexes qui nécessitent de la flexibilité et des fonctions puissantes, tandis que CodeIgniter4 convient au développement rapide et aux petites applications.

Comment les capacités de traitement des données de Laravel et de CodeIgniter se comparent-elles ? Comment les capacités de traitement des données de Laravel et de CodeIgniter se comparent-elles ? Jun 01, 2024 pm 01:34 PM

Comparez les capacités de traitement des données de Laravel et CodeIgniter : ORM : Laravel utilise EloquentORM, qui fournit un mappage relationnel classe-objet, tandis que CodeIgniter utilise ActiveRecord pour représenter le modèle de base de données en tant que sous-classe de classes PHP. Générateur de requêtes : Laravel dispose d'une API de requêtes chaînées flexible, tandis que le générateur de requêtes de CodeIgniter est plus simple et basé sur des tableaux. Validation des données : Laravel fournit une classe Validator qui prend en charge les règles de validation personnalisées, tandis que CodeIgniter a moins de fonctions de validation intégrées et nécessite un codage manuel des règles personnalisées. Cas pratique : l'exemple d'enregistrement d'utilisateur montre Lar

Le premier Snapdragon 8 Gen3 petit pliable ! Xiaomi MIX Flip rejoint Internet : charge rapide 67 W, très grand écran secondaire Le premier Snapdragon 8 Gen3 petit pliable ! Xiaomi MIX Flip rejoint Internet : charge rapide 67 W, très grand écran secondaire May 31, 2024 pm 08:26 PM

Selon les informations du 11 mai, Xiaomi MIX Flip est officiellement entré sur Internet et les données montrent qu'il prend en charge une charge rapide de 67 W. Il convient de noter que le nouveau téléphone est certifié comme téléphone mobile numérique 5G, c'est-à-dire un téléphone mobile 5G, et ne prend pas en charge les communications par satellite. Selon les rapports, les principales caractéristiques du téléphone incluent un écran secondaire extra-large, les performances phares du Snapdragon 8Gen3, un corps fin et tendance et des portraits de haute qualité. MIX Flip adoptera également la solution traditionnelle à double écran, mais l'écran secondaire à l'arrière est de taille énorme et couvre toute la moitié supérieure du corps, à l'exception de la caméra arrière. Il peut être utilisé pour afficher des notifications, la météo et d'autres informations sans problème. devoir retourner le couvercle à chaque fois pour le voir. Le haut de l’écran secondaire est équipé d’un système d’imagerie Leica à double caméra, disposé horizontalement. Parmi eux, la caméra principale utilise un capteur Light Hunter 800 d'une taille de 1/1,55 ​​​​pouces.

Tests unitaires de code PHP et tests d'intégration Tests unitaires de code PHP et tests d'intégration May 07, 2024 am 08:00 AM

Guide des tests unitaires et d'intégration PHP Tests unitaires : concentrez-vous sur une seule unité de code ou de fonction et utilisez PHPUnit pour créer des classes de cas de test à des fins de vérification. Tests d'intégration : faites attention à la façon dont plusieurs unités de code fonctionnent ensemble et utilisez les méthodes setUp() et TearDown() de PHPUnit pour configurer et nettoyer l'environnement de test. Cas pratique : utilisez PHPUnit pour effectuer des tests unitaires et d'intégration dans les applications Laravel, notamment la création de bases de données, le démarrage de serveurs et l'écriture de code de test.

Résumé complet de la configuration du Xiaomi MIX Flip : tracez une ligne claire entre les beaux petits déchets Résumé complet de la configuration du Xiaomi MIX Flip : tracez une ligne claire entre les beaux petits déchets Jul 19, 2024 pm 10:22 PM

A quoi sert un petit paravent ? C’est une question que de nombreuses personnes ont soulevée lors de la sortie de cette forme de produit. L'écran externe est quasiment inutilisable. Tout au plus faut-il encore ouvrir le téléphone pour lire les notifications. Alors à quoi ça sert de le plier ? Plus facile à transporter ? Ou les accessoires doivent-ils être embellis et utilisés comme objets de mode ? Et il y a un autre problème. Le prix élevé n'a pas l'expérience phare, la durée de vie de la batterie est faible et les performances sont médiocres. Comment Xiaomi, qui n’a jamais fabriqué de pliables, devrait-il s’y prendre ? Le Xiaomi MIX Flip, préchauffé depuis deux jours, brisera-t-il le stéréotype du « beau petit déchet » ? Les performances de chargement de la batterie sont comparables à celles des produits phares. Le Xiaomi MIX Flip est équipé du processeur phare actuel - Snapdragon 8Gen3. Le processeur pliable Xiaomi actuel est équipé du Snapdragon 8.

See all articles