Front-End Assets

Introduction

Bow est préconfiguré avec un environnement Frontend moderne, incluant React, Vue.js et Sass, basé sur le package Laravel Mix. Cette configuration permet d'accélérer considérablement le développement d'applications web.

Installation des dépendances

Pour lancer la compilation, rendez-vous dans la racine de votre application et tapez npm install ou yarn install dans votre console, selon le gestionnaire de packages que vous utilisez.

npm install
# ou
yarn install

Commandes de compilation

Compilation en mode développement

Lance la compilation des fichiers définis dans webpack.mix.js sans optimisation.

npm run dev

Compilation en mode production

Compile et minifie les sources définies dans webpack.mix.js pour optimiser les performances.

npm run prod

Surveiller les changements

Surveille automatiquement les changements des fichiers définis dans webpack.mix.js et relance la compilation à chaque modification.

npm run watch

Mode watch

Cette commande est particulièrement utile pendant le développement, car elle recompile automatiquement vos assets dès que vous sauvegardez un fichier.

Formatage et validation du code

Code Sniffer est un outil qui permet de formater le code, valider sa qualité et réorganiser votre code selon les standards de développement (ici le standard PSR-2).

Cette commande lance également format, un outil de validation syntaxique pour PHP.

npm run format

Configuration avec Webpack Mix

Le fichier webpack.mix.js vous permet de définir les fichiers JavaScript, JSX et Sass à compiler. Voici la configuration par défaut :

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

mix.react('assets/js/app.js', 'public/js')
   .sass('assets/sass/app.scss', 'public/css');

Personnalisation

Vous pouvez facilement ajouter d'autres fichiers à compiler :

mix.react('assets/js/app.js', 'public/js')
   .sass('assets/sass/app.scss', 'public/css')
   .js('assets/js/custom.js', 'public/js')
   .version(); // Active le versioning des assets

Documentation

Pour plus d'informations sur toutes les fonctionnalités de Laravel Mix, consultez la documentation officielle.

Il manque quelque chose ?

Si vous rencontrez des problèmes avec la documentation ou si vous avez des suggestions pour améliorer la documentation ou le projet en général, veuillez déposer une issue pour nous, ou envoyer un tweet mentionnant le compte Twitter @bowframework ou sur directement sur le github.