Skip to content

Mein erster Docker-Stack mit Vue als Frontend, und dann mal weiter sehen

Notifications You must be signed in to change notification settings

ThomasHaas299/docker_vue_stack

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

2 Commits
 
 
 
 
 
 
 
 

Repository files navigation

Initialisierung von Vue ohne lokale node-Installation

ACHTUNG: Die folgenden Aufgaben werden in einem leeren Projektverzeichnis ausgeführt!

Im Projektverzeichnis das folgende Kommando ausführen:

docker run -it --rm -v $(pwd):/app -p 5173:5173 -w/app node:iron-alpine3.20 /bin/sh

Dadurch befinde ich mich im in einem Node-Container im Stammverzeichnis. Das kann ich mit ls -la überprüfen. Hier kann ich jetzt die Basis-Installation meines Frontends mit Vite durchführen. Achtung, dadurch wird das Verzeichnis "frontend" (also "Project name") gelöscht, falls es vorhanden sein sollte!

npm create vue@latest

✔ Project name: … frontend
✔ Target directory "frontend" is not empty. Remove existing files and continue? … No / Yes
✔ Add TypeScript? … No / Yes
✔ Add JSX Support? … No / Yes
✔ Add Vue Router for Single Page Application development? … No / Yes
✔ Add Pinia for state management? … No / Yes
✔ Add Vitest for Unit Testing? … No / Yes
✔ Add an End-to-End Testing Solution? › No
✔ Add ESLint for code quality? … No / Yes
✔ Add Prettier for code formatting? … No / Yes
✔ Add Vue DevTools 7 extension for debugging? (experimental) … No / Yes

Jetzt kann ich die notwendigen Modules installieren und testweise einmal das Ergebnis ansehen.

cd frontend
npm install
npm run format
npm run dev -- --host

Durch die Angabe von --host wird das Ganze nach außen weitergereicht und ich kann mir die Vite-Standard-Installation ansehen:

http://localhost:5173/

Dockerisierung

Anpassung in package.json: "dev": "vite --host --port 80". Hier wurde "host" und "port" hinzugefügt.

In compose.yaml wählt man unter services:frontent:build das entsprechende target, entweder development-stage oder production-stage.`

About

Mein erster Docker-Stack mit Vue als Frontend, und dann mal weiter sehen

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published