Bonjour à tous,
Version la plus récente de l’OP
Je suis confronté à un problème étrange avec ma webapp vuejs.
- Si j’utilise :
npm run serve
, alors il va lancer le serveur vuejs dev et il faire le rendu correctement des fichiers construits. - Si j’utilise docker : il lance le serveur dev vuejs, puis construit les fichiers, mais il fera le rendu d’une ancienne version des fichiers construits !
Un autre comportement étrange est :
- Lorsque j’exécute
npm run serve
, alors mes modifications de code VueJS en direct seront rebuilt en direct. (attendu) - Mais si j’utilise Docker, alors mes modifications de code VueJS en direct ne seront pas rebuilt (comportement réel et non-prévu).
Le Dockerfile de VueJS que j’ai écrit est :
FROM node:14-alpine
WORKDIR /src
COPY package*.json ./
Lancer npm install
VOLUME /src
EXPOSE 8080
CMD ["npm", "run", "serve"] # package.JSON contient : '"scripts" : { "serve" : "vue-cli-service serve",'
Le docker-compose.YML
de Laravel, qui est utilisé par la commande vendor/bin/sail up
de Laravel et qui lancera le service vuejs , définit ce service :
vuejs :
build :
context : /home/FOOBAR/Documents/projets/web/job-board-front
dockerfile : Dockerfile
ports :
- '8080:8080'
réseaux :
- voile
depends_on :
- laravel.test
volumes :
- '/home/FOOBAR/Documents/projets/web/job-board-front/src:/src'
NB:
Dans tout ce post, "si j’utilise docker" signifie systématiquement : si je tape vendor/bin/sail up
, qui exécute les conteneurs Docker Laravel et les réseaux définis dans le fichier docker-compose.YML
ci-dessus.
Pouvez-vous me dire ce qui ne va pas dans ma configuration Docker s’il vous plaît ?
Je pense qu’il s’agit d’un problème de configuration de Docker car npm run serve
directement tapé dans le projet d’application vuejs fonctionne bien. Les bugs ne se produisent que lors de l’exécution avec docker.
Ancien OP
Aujourd’hui j’ai besoin de Dockeriser mon application VueJS afin de pouvoir la mettre dans le même domaine que le container docker de mon application Laravel. Autrement dit, à terme je voudrais faire un doker network connect réseau_laravel_sail container_vuejs
. ("Sail" est juste une surcouche logicielle de Laravel qui permet de démarrer un container docker pour le serveur HTTP de laravel + son serveur mysql + son serveur ceci cela, et de les gérer sans devoir taper une commande docker à proprement parler).
Pourquoi ai-je besoin de mettre ça sur un même réseau ? Juste parce que j’utilise un authentificateur d’utilisateurs dénommé "Sanctum" et que VueJS ne sera capable d’envoyer les identifiants de connexion à Laravel Sanctum sans génération d’une CORS Policy Errors si, et seulement si, VueJS est présent sur le même domaine que Laravel/Laravel Sanctum. Mais bref nous nous égarons. :clemhehe: (je me permets juste de rajouter que VueJS sans avoir été préalablement dockeurisé peut tout à fait communiquer avec le serveur Laravel qui quant à lui est dockeurisé, ça me semble étrange puisque normalement il faut que tout soit sur un même réseau docker pour que ça puisse communiquer ! mais passons).
Du coup j’ai créé ce Dockerfile VueJS :
FROM node:14-alpine
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
EXPOSE 8080
CMD ["npm", "run", "serve"]
Et pour le lancer : docker run my-vuejs-app
.
Le souci est le suivant : il semblerait que quand je modifie le code des fichiers de l’application VueJS, il faille que je relance un docker build -t my-vuejs-app .
pour en tenir compte. Utiliser --watch
de npm
ou autre listen
ne fonctionne pas…
Etant débutant à la fois en Docker et VueJS, je vous avouerais ne pas trop savoir quoi faire. Je n’ai pas envie de devoir relancer docker build -t my-vuejs-app .
à chaque micro-modif que j’ai faite dans l’un des fichiers de VueJS pour les voir haha.
Pourriez-vous s’il vous plaît me donner un indice sur la marche à suivre ?
Merci !