Commit 66c6f5ba authored by Mhurd's avatar Mhurd
Browse files

initial commit

parents
node_modules
.DS_Store
dist
dist-ssr
*.local
node_modules/
\ No newline at end of file
# build stage
FROM node:lts-alpine as build-stage
WORKDIR /app
EXPOSE 3000 3001
COPY package.json .
RUN npm install
COPY . .
RUN npm run build
# production stage
# FROM nginx:stable-alpine as production-stage
# COPY --from=build-stage /app/dist /usr/share/nginx/html
# EXPOSE 80
# CMD ["nginx", "-g", "daemon off;"]
\ No newline at end of file
SHELL := /bin/bash
.DEFAULT: freshinstall
.PHONY: freshinstall
freshinstall:
make stop
make remove
make prepare
make start
.PHONY: prepare
prepare:
echo "Makefile prepare placeholder"
docker compose up --no-start
.PHONY: remove
remove:
-docker container rm vite-docker
-docker image rm vite-docker
-@if [ -d "./node_modules" ]; then \
read -p "Are you sure you wish to delete the existing package-lock.json and node_modules folder? (y/n)? " -n 1 -r; \
echo ; \
if [ "$$REPLY" = "y" ]; then \
rm -rf ./node_modules; \
rm package-lock.json; \
fi \
fi
.PHONY: start
start:
( sleep 3; open http://localhost:3000 || xdg-open http://localhost:3000 || echo "Open 'http://localhost:3000' in a browser to view BrowserSync pages." ) &
docker compose up
.PHONY: stop
stop:
-docker compose down
.PHONY: restart
restart:
make stop
make start
.PHONY: sh
sh:
docker exec -it vite-docker sh
\ No newline at end of file
Ultra-basic Dockerized Vue 3 + Vite sample project. Running "make" spins it up from scratch.
\ No newline at end of file
version: '3.4'
services:
vite-docker:
image: vite-docker
container_name: vite-docker
build:
context: .
dockerfile: Dockerfile
command: "npm run dev"
# command: tail -f /dev/null
ports:
- 3000:3000
- 3001:3001
volumes:
- .:/app
- /app/node_modules
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite App</title>
</head>
<body>
<div id="app"></div>
<script type="module" src="/src/main.js"></script>
</body>
</html>
{
"name": "vitetest",
"version": "0.0.0",
"scripts": {
"dev": "vite --host 0.0.0.0",
"build": "vite build",
"preview": "vite preview"
},
"dependencies": {
"n": "^8.0.2",
"vue": "^3.2.25"
},
"devDependencies": {
"@vitejs/plugin-vue": "^2.0.0",
"vite": "^2.7.2"
}
}
<script setup>
// This starter template is using Vue 3 <script setup> SFCs
// Check out https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup
import HelloWorld from './components/HelloWorld.vue'
</script>
<template>
<img alt="Vue logo" src="./assets/logo.png" />
<HelloWorld msg="Hello Vue 3 + Vite" />
</template>
<style>
#app {
font-family: Avenir, Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-align: center;
color: #2c3e50;
margin-top: 60px;
}
</style>
<script setup>
import { ref } from 'vue'
defineProps({
msg: String
})
const count = ref(0)
</script>
<template>
<h1>{{ msg }}</h1>
<p>
Recommended IDE setup:
<a href="https://code.visualstudio.com/" target="_blank">VSCode</a>
+
<a href="https://github.com/johnsoncodehk/volar" target="_blank">Volar</a>
</p>
<p>
<a href="https://vitejs.dev/guide/features.html" target="_blank">
Vite Documentation
</a>
|
<a href="https://v3.vuejs.org/" target="_blank">Vue 3 Documentation</a>
</p>
<button type="button" @click="count++">count is: {{ count }}</button>
<p>
Edit
<code>components/HelloWorld.vue</code> to test hot module replacement.
</p>
</template>
<style scoped>
a {
color: #42b983;
}
</style>
import { createApp } from 'vue'
import App from './App.vue'
createApp(App).mount('#app')
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
// https://vitejs.dev/config/
export default defineConfig({
plugins: [vue()]
})
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment