migrate vue-cli to vite
This commit is contained in:
Alberto Xamin
parent
26869b79e0
commit
2701e682b4
@ -1,5 +1,5 @@
|
|||||||
# build Vue frontend
|
# build Vue frontend
|
||||||
FROM node:16-alpine as builder
|
FROM node:19-alpine as builder
|
||||||
COPY ./frontend .
|
COPY ./frontend .
|
||||||
RUN npm install
|
RUN npm install
|
||||||
RUN npm run build
|
RUN npm run build
|
||||||
|
|||||||
@ -1,5 +0,0 @@
|
|||||||
module.exports = {
|
|
||||||
presets: [
|
|
||||||
'@vue/cli-plugin-babel/preset'
|
|
||||||
]
|
|
||||||
}
|
|
||||||
@ -6,7 +6,7 @@
|
|||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
|
||||||
<meta name="keywords" content="bang, bang online, bang game, bang multiplayer, bang card game, bang card game online, Bang! card game rules online, play Bang! online, bang online with friends, high noon, dodge city, gold rush"/>
|
<meta name="keywords" content="bang, bang online, bang game, bang multiplayer, bang card game, bang card game online, Bang! card game rules online, play Bang! online, bang online with friends, high noon, dodge city, gold rush"/>
|
||||||
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
|
<link rel="icon" href="/favicon.ico">
|
||||||
<meta name="theme-color" content="black">
|
<meta name="theme-color" content="black">
|
||||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||||
<meta name="apple-mobile-web-app-status-bar-style" content="default">
|
<meta name="apple-mobile-web-app-status-bar-style" content="default">
|
||||||
@ -23,10 +23,11 @@
|
|||||||
<meta property="og:url" content="https://bang.xamin.it/" />
|
<meta property="og:url" content="https://bang.xamin.it/" />
|
||||||
<!-- <meta property="og:image" content="http://example.com/image.jpg" /> -->
|
<!-- <meta property="og:image" content="http://example.com/image.jpg" /> -->
|
||||||
<meta property="og:description" content="Wanna play Bang with your friends but you cannot meet in person? Play Bang! the online multiplayer card game. It includes expansion like Gold Rush, Dodge City, Fistful of Cards and High Noon" />
|
<meta property="og:description" content="Wanna play Bang with your friends but you cannot meet in person? Play Bang! the online multiplayer card game. It includes expansion like Gold Rush, Dodge City, Fistful of Cards and High Noon" />
|
||||||
|
<script type="module" src="/src/main.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<noscript>
|
<noscript>
|
||||||
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
|
<strong>We're sorry but to play Bang! you need JavaScript enabqled. Please enable it to play.</strong>
|
||||||
</noscript>
|
</noscript>
|
||||||
<div id="app"></div>
|
<div id="app"></div>
|
||||||
<!-- built files will be auto injected -->
|
<!-- built files will be auto injected -->
|
||||||
@ -1,36 +1,32 @@
|
|||||||
{
|
{
|
||||||
"name": "frontend",
|
"name": "bang-frontend",
|
||||||
"version": "0.1.0",
|
"version": "0.1.0",
|
||||||
"private": true,
|
"private": true,
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"serve": "vue-cli-service serve",
|
"serve": "vite",
|
||||||
"build": "vue-cli-service build",
|
"build": "vite build",
|
||||||
"lint": "vue-cli-service lint"
|
"lint": "eslint --ext .js,.vue --ignore-path .gitignore --fix src"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@datadog/browser-rum": "^4.33.0",
|
"@datadog/browser-rum": "^4.33.0",
|
||||||
|
"bang-vue-socket.io": "^4.0.0",
|
||||||
"caniuse-lite": "^1.0.30001451",
|
"caniuse-lite": "^1.0.30001451",
|
||||||
"core-js": "^3.16.2",
|
|
||||||
"pretty-checkbox-vue": "^1.1.9",
|
"pretty-checkbox-vue": "^1.1.9",
|
||||||
"register-service-worker": "^1.7.2",
|
"register-service-worker": "^1.7.2",
|
||||||
"vue": "^2.6.14",
|
"vue": "^2.6.14",
|
||||||
"vue-clipboard2": "^0.3.3",
|
"vue-clipboard2": "^0.3.3",
|
||||||
"vue-i18n": "^8.28.2",
|
"vue-i18n": "^8.28.2",
|
||||||
"vue-json-viewer": "^2.2.22",
|
"vue-json-viewer": "^2.2.22",
|
||||||
"vue-router": "^3.6.5",
|
"vue-router": "^3.6.5"
|
||||||
"bang-vue-socket.io": "^4.0.0"
|
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@vue/cli-plugin-babel": "^5.0.8",
|
"eslint": "^8.33.0",
|
||||||
"@vue/cli-plugin-eslint": "^5.0.8",
|
"eslint-plugin-vue": "^9.9.0",
|
||||||
"@vue/cli-plugin-pwa": "^5.0.8",
|
"vite": "^4.1.1",
|
||||||
"@vue/cli-plugin-router": "^5.0.8",
|
"vite-plugin-html": "^3.2.0",
|
||||||
"@vue/cli-service": "^5.0.8",
|
"vite-plugin-pwa": "^0.14.3",
|
||||||
"babel-eslint": "^10.1.0",
|
"vite-plugin-vue2": "^2.0.3",
|
||||||
"eslint": "^7.5.0",
|
"vue-template-compiler": "^2.7.14"
|
||||||
"eslint-plugin-vue": "^7.20.0",
|
|
||||||
"vue-template-compiler": "^2.6.14",
|
|
||||||
"workbox-webpack-plugin": "^6.5.4"
|
|
||||||
},
|
},
|
||||||
"eslintConfig": {
|
"eslintConfig": {
|
||||||
"root": true,
|
"root": true,
|
||||||
@ -41,9 +37,6 @@
|
|||||||
"plugin:vue/essential",
|
"plugin:vue/essential",
|
||||||
"eslint:recommended"
|
"eslint:recommended"
|
||||||
],
|
],
|
||||||
"parserOptions": {
|
|
||||||
"parser": "babel-eslint"
|
|
||||||
},
|
|
||||||
"rules": {}
|
"rules": {}
|
||||||
},
|
},
|
||||||
"browserslist": [
|
"browserslist": [
|
||||||
|
|||||||
@ -120,7 +120,8 @@
|
|||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import Card from './Card'
|
import Card from '@/components/Card.vue'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'Help',
|
name: 'Help',
|
||||||
components: {
|
components: {
|
||||||
|
|||||||
@ -39,8 +39,6 @@ const i18n = new VueI18n({
|
|||||||
fallbackLocale: fallbackLocale
|
fallbackLocale: fallbackLocale
|
||||||
})
|
})
|
||||||
|
|
||||||
import './registerServiceWorker'
|
|
||||||
|
|
||||||
new Vue({
|
new Vue({
|
||||||
i18n,
|
i18n,
|
||||||
router,
|
router,
|
||||||
|
|||||||
@ -1,41 +0,0 @@
|
|||||||
/* eslint-disable no-console */
|
|
||||||
|
|
||||||
import { register } from 'register-service-worker'
|
|
||||||
|
|
||||||
if (process.env.NODE_ENV === 'production') {
|
|
||||||
register(`${process.env.BASE_URL}service-worker.js`, {
|
|
||||||
ready () {
|
|
||||||
console.log(
|
|
||||||
'App is being served from cache by a service worker.\n' +
|
|
||||||
'For more details, visit https://goo.gl/AFskqB'
|
|
||||||
)
|
|
||||||
},
|
|
||||||
registered () {
|
|
||||||
console.log('Service worker has been registered.')
|
|
||||||
},
|
|
||||||
cached () {
|
|
||||||
console.log('Content has been cached for offline use.')
|
|
||||||
},
|
|
||||||
updatefound () {
|
|
||||||
console.log('New content is downloading.')
|
|
||||||
},
|
|
||||||
updated (registration) {
|
|
||||||
console.log('New content is available; please refresh.')
|
|
||||||
let confirmationResult = confirm("New version found! Do you want to reload the app?")
|
|
||||||
if (confirmationResult) registration.waiting.postMessage({action: "skipWaiting"})
|
|
||||||
},
|
|
||||||
offline () {
|
|
||||||
console.log('No internet connection found. App is running in offline mode.')
|
|
||||||
},
|
|
||||||
error (error) {
|
|
||||||
console.error('Error during service worker registration:', error)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
let refreshing
|
|
||||||
navigator.serviceWorker.addEventListener("controllerchange", function() {
|
|
||||||
if (refreshing) return
|
|
||||||
window.location.reload()
|
|
||||||
refreshing = true
|
|
||||||
})
|
|
||||||
}
|
|
||||||
@ -27,8 +27,8 @@ const routes = [
|
|||||||
]
|
]
|
||||||
|
|
||||||
const router = new VueRouter({
|
const router = new VueRouter({
|
||||||
mode: process.env.NODE_ENV === "development" ? 'hash' : 'history',
|
mode: import.meta.env.NODE_ENV === "development" ? 'hash' : 'history',
|
||||||
base: process.env.BASE_URL,
|
base: import.meta.env.BASE_URL,
|
||||||
routes
|
routes
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|||||||
@ -1,8 +0,0 @@
|
|||||||
self.__precacheManifest = [].concat(self.__precacheManifest || []);
|
|
||||||
|
|
||||||
// install new service worker when ok, then reload page.
|
|
||||||
self.addEventListener("message", msg=>{
|
|
||||||
if (msg.data.action=='skipWaiting'){
|
|
||||||
self.skipWaiting()
|
|
||||||
}
|
|
||||||
})
|
|
||||||
26
frontend/vite.config.js
Normal file
26
frontend/vite.config.js
Normal file
@ -0,0 +1,26 @@
|
|||||||
|
import { defineConfig } from "vite";
|
||||||
|
// import vue from '@vitejs/plugin-vue' // vue 3
|
||||||
|
import { createVuePlugin as vue } from "vite-plugin-vue2"; //vue 2
|
||||||
|
import { createHtmlPlugin } from 'vite-plugin-html'
|
||||||
|
import { VitePWA } from 'vite-plugin-pwa'
|
||||||
|
|
||||||
|
const path = require("path");
|
||||||
|
|
||||||
|
// https://vitejs.dev/config/
|
||||||
|
export default defineConfig({
|
||||||
|
plugins: [
|
||||||
|
vue(),
|
||||||
|
VitePWA({ registerType: 'autoUpdate' }),
|
||||||
|
createHtmlPlugin({
|
||||||
|
minify: true,
|
||||||
|
inject: {
|
||||||
|
data: {}
|
||||||
|
}
|
||||||
|
}),
|
||||||
|
],
|
||||||
|
resolve: {
|
||||||
|
alias: {
|
||||||
|
"@": path.resolve(__dirname, "./src"),
|
||||||
|
},
|
||||||
|
},
|
||||||
|
});
|
||||||
7732
frontend/yarn.lock
7732
frontend/yarn.lock
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue
Block a user