Configure chunks

babel.config.js

@@ -1,5 +1,5 @@
 module.exports = {
   presets: [
-    '@vue/app.vue'
+    '@vue/app'
   ]
 }

index.html

@@ -6,7 +6,6 @@
 	<meta http-equiv="X-UA-Compatible" content="IE=edge">
 	<meta name="viewport" content="width=device-width,initial-scale=1.0">
 	<meta name="description" content="Vikunja (/vɪˈkuːnjə/) - The to-do app to organize your life.">
-	<meta name="hash" content="<%= webpack.hash %>"/>
 
 	<link rel="icon" href="/favicon.ico">
 	<link rel="preload" crossorigin="anonymous" href="/fonts/open-sans-v15-latin-700italic.woff2" as="font">

package.json

@@ -3,9 +3,9 @@
   "version": "0.10.0",
   "private": true,
   "scripts": {
-    "serve": "vue-cli-service serve",
+    "serve": "npx vite preview",
     "serve:dist": "node scripts/serve-dist.js",
-    "build": "vue-cli-service build --modern",
+    "build": "npx vite build --modern",
     "build:report": "vue-cli-service build --report",
     "lint": "vue-cli-service lint --ignore-pattern '*.test.*'",
     "cypress:open": "cypress open",

src/router/index.js

@@ -47,46 +47,46 @@ import NamespaceSettingDelete from '../views/namespaces/settings/delete'
 import CreateSavedFilter from '../views/filters/CreateSavedFilter'
 
 const PasswordResetComponent = () => ({
-	component: import(/* webpackChunkName: "user-settings" */'../views/user/PasswordReset'),
+	component: import('../views/user/PasswordReset'),
 	loading: LoadingComponent,
 	error: ErrorComponent,
 	timeout: 60000,
 })
 const GetPasswordResetComponent = () => ({
-	component: import(/* webpackChunkName: "user-settings" */'../views/user/RequestPasswordReset'),
+	component: import('../views/user/RequestPasswordReset'),
 	loading: LoadingComponent,
 	error: ErrorComponent,
 	timeout: 60000,
 })
 const UserSettingsComponent = () => ({
-	component: import(/* webpackChunkName: "user-settings" */'../views/user/Settings'),
+	component: import('../views/user/Settings'),
 	loading: LoadingComponent,
 	error: ErrorComponent,
 	timeout: 60000,
 })
 // List Handling
 const NewListComponent = () => ({
-	component: import(/* webpackChunkName: "settings" */'../views/list/NewList'),
+	component: import('../views/list/NewList'),
 	loading: LoadingComponent,
 	error: ErrorComponent,
 	timeout: 60000,
 })
 // Namespace Handling
 const NewNamespaceComponent = () => ({
-	component: import(/* webpackChunkName: "settings" */'../views/namespaces/NewNamespace'),
+	component: import('../views/namespaces/NewNamespace'),
 	loading: LoadingComponent,
 	error: ErrorComponent,
 	timeout: 60000,
 })
 
 const EditTeamComponent = () => ({
-	component: import(/* webpackChunkName: "settings" */'../views/teams/EditTeam'),
+	component: import('../views/teams/EditTeam'),
 	loading: LoadingComponent,
 	error: ErrorComponent,
 	timeout: 60000,
 })
 const NewTeamComponent = () => ({
-	component: import(/* webpackChunkName: "settings" */'../views/teams/NewTeam'),
+	component: import('../views/teams/NewTeam'),
 	loading: LoadingComponent,
 	error: ErrorComponent,
 	timeout: 60000,

vite.config.js

@@ -12,4 +12,25 @@ module.exports = {
 		],
 		extensions: ['.mjs', '.js', '.ts', '.jsx', '.tsx', '.json', '.vue'],
 	},
+	build: {
+		target: 'es2015',
+		manifest: true,
+		rollupOptions: {
+			output: {
+				manualChunks:{
+					'user-settings': [
+						'./src/views/user/PasswordReset',
+						'./src/views/user/RequestPasswordReset',
+						'./src/views/user/Settings',
+					],
+					'settings': [
+						'./src/views/list/NewList',
+						'./src/views/namespaces/NewNamespace',
+						'./src/views/teams/EditTeam',
+						'./src/views/teams/NewTeam',
+					],
+				},
+			},
+		},
+	},
 }