Laravel France

Optimiser environnement du dev frontend/vuejs

  • Avatar de bArraxasArraxas
    Membre depuis :
    05/12/2019
    Messages :
    3

    Bonjour à tous,

    La commande "npm run watch" est plutôt pas mal mais absolument pas adaptée au développement d'une SPA (single page application) vuejs, pour ces raisons :

    • Rechargement intégral de l'application à chaque modification de fichier : js, vue ou php.
    • Rechargement à chaud du scss mais la compilation prend 4-6 sec (sur un pc puissant et avec les vendors séparés du app.scss)

    Outre les rechargements inutiles, on ne profite aucunement du rechargement à chaud proposé par VueCli (vue-cli-service serve).

    Autant dire que le developpement dans ces conditions est un vrai calvert.

    Alors il existe une solution mais qui ne fonctionne absolument pas à savoir :

    • créer un dossier "frontend" à la racine du projet laravel et y déposer notre SPA VueJs
    • dans le dossier frontend y créer également un fichier vue.config.js

    Dans le fichier vue.config.js :

    module.exports = {
    // proxy API requests to Valet during development
    devServer: {
    proxy: 'http://localhost' // ou 'http://localhost/3000' si vous utilisez "npm run watch" mais ce n'est pas utile dans le cadre d'une SPA
    },

    // output built static files to Laravel's public dir.
    // note the "build" script in package.json needs to be modified as well.
    outputDir: '../public',

    // modify the location of the generated HTML file.
    // make sure to do this only in production.
    indexPath: process.env.NODE_ENV === 'production'
    ? '../resources/views/app.blade.php'
    : 'index.html'
    }

    Malheureusement cette solution ne fonctionne pas malgré de nombreuses variantes de tentées.

    Est-ce qu'une bonne âme peut me venir en aide ?

    Un grand merci,

    Bonne journée,

Vous ne pouvez pas répondre à ce sujet.