• Vue3 (vite)
• TypeScript
• Docker

Project Setup

npm install

Compile and Hot-Reload for Development

npm run dev

Type-Check, Compile and Minify for Production

npm run build

Visit via http://localhost:5173

Build image

docker run -t imageName:version .

Tag image

docker tag imageName:version imageName:new_version

Run image as a container

docker run -d -p 5173:5173 --name containerName imageName:version >>The port is 5173, which is set in ./vite.config.ts

Visit via http://localhost:5173

List containers

docker ps

Stop containers

docker stop containerName

Build image and run it as a container

docker-compose up -d

Rebuild the image

docker-compose up --build -d

Port problem Vue3(Vite) - TypeScript project running within docker container but http://localhost:8080 is out of connect. Solution configure host within ./vite.config.ts

import { fileURLToPath, URL } from 'node:url'
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'

// https://vitejs.dev/config/
export default defineConfig({
plugins: [vue()],
resolve: {
    alias: {
    '@': fileURLToPath(new URL('./src', import.meta.url))
    }
},
// localhost:port
server: {
    host: true,
    port:5173
}
})

Map View