Client - update build config (since Vite uses Rollup)

Note: remove unneeded lazy loading
This commit is contained in:
Sam 2023-11-15 12:16:59 +01:00
parent 8228db5b24
commit c62151b617
3 changed files with 71 additions and 84 deletions

View File

@ -25,10 +25,22 @@ import createI18n from '@/i18n'
import store from '@/store'
import { AUTH_USER_STORE } from '@/store/constants'
import AboutView from '@/views/AboutView.vue'
import AdminView from '@/views/AdminView.vue'
import Dashboard from '@/views/Dashboard.vue'
import NotFoundView from '@/views/NotFoundView.vue'
import PrivacyPolicyView from '@/views/PrivacyPolicyView.vue'
import StatisticsView from '@/views/StatisticsView.vue'
import AccountConfirmationResendView from '@/views/user/AccountConfirmationResendView.vue'
import AccountConfirmationView from '@/views/user/AccountConfirmationView.vue'
import EmailUpdateView from '@/views/user/EmailUpdateView.vue'
import LoginOrRegister from '@/views/user/LoginOrRegister.vue'
import PasswordResetView from '@/views/user/PasswordResetView.vue'
import ProfileView from '@/views/user/ProfileView.vue'
import UserView from '@/views/user/UserView.vue'
import AddWorkout from '@/views/workouts/AddWorkout.vue'
import EditWorkout from '@/views/workouts/EditWorkout.vue'
import Workout from '@/views/workouts/Workout.vue'
import WorkoutsView from '@/views/workouts/WorkoutsView.vue'
const { t } = createI18n.global
@ -70,10 +82,7 @@ const routes: Array<RouteRecordRaw> = [
{
path: '/account-confirmation',
name: 'AccountConfirmation',
component: () =>
import(
/* webpackChunkName: 'profile' */ '@/views/user/AccountConfirmationView.vue'
),
component: AccountConfirmationView,
meta: {
title: 'user.ACCOUNT_CONFIRMATION',
withoutAuth: true,
@ -82,10 +91,7 @@ const routes: Array<RouteRecordRaw> = [
{
path: '/account-confirmation/resend',
name: 'AccountConfirmationResend',
component: () =>
import(
/* webpackChunkName: 'reset' */ '@/views/user/AccountConfirmationResendView.vue'
),
component: AccountConfirmationResendView,
props: { action: 'account-confirmation-resend' },
meta: {
title: 'buttons.ACCOUNT-CONFIRMATION-RESEND',
@ -95,10 +101,7 @@ const routes: Array<RouteRecordRaw> = [
{
path: '/account-confirmation/email-sent',
name: 'AccountConfirmationEmailSend',
component: () =>
import(
/* webpackChunkName: 'reset' */ '@/views/user/AccountConfirmationResendView.vue'
),
component: AccountConfirmationResendView,
props: { action: 'email-sent' },
meta: {
title: 'buttons.ACCOUNT-CONFIRMATION-RESEND',
@ -108,10 +111,7 @@ const routes: Array<RouteRecordRaw> = [
{
path: '/password-reset/sent',
name: 'PasswordEmailSent',
component: () =>
import(
/* webpackChunkName: 'reset' */ '@/views/user/PasswordResetView.vue'
),
component: () => PasswordResetView,
props: { action: 'request-sent' },
meta: {
title: 'user.PASSWORD_RESET',
@ -121,10 +121,7 @@ const routes: Array<RouteRecordRaw> = [
{
path: '/password-reset/request',
name: 'PasswordResetRequest',
component: () =>
import(
/* webpackChunkName: 'reset' */ '@/views/user/PasswordResetView.vue'
),
component: PasswordResetView,
props: { action: 'reset-request' },
meta: {
title: 'user.PASSWORD_RESET',
@ -134,10 +131,7 @@ const routes: Array<RouteRecordRaw> = [
{
path: '/password-reset/password-updated',
name: 'PasswordUpdated',
component: () =>
import(
/* webpackChunkName: 'reset' */ '@/views/user/PasswordResetView.vue'
),
component: PasswordResetView,
props: { action: 'password-updated' },
meta: {
title: 'user.PASSWORD_RESET',
@ -147,10 +141,7 @@ const routes: Array<RouteRecordRaw> = [
{
path: '/password-reset',
name: 'PasswordReset',
component: () =>
import(
/* webpackChunkName: 'reset' */ '@/views/user/PasswordResetView.vue'
),
component: PasswordResetView,
props: { action: 'reset' },
meta: {
title: 'user.PASSWORD_RESET',
@ -160,10 +151,7 @@ const routes: Array<RouteRecordRaw> = [
{
path: '/email-update',
name: 'EmailUpdate',
component: () =>
import(
/* webpackChunkName: 'profile' */ '@/views/user/EmailUpdateView.vue'
),
component: EmailUpdateView,
meta: {
title: 'user.EMAIL_UPDATE',
withoutChecks: true,
@ -172,8 +160,7 @@ const routes: Array<RouteRecordRaw> = [
{
path: '/profile',
name: 'Profile',
component: () =>
import(/* webpackChunkName: 'profile' */ '@/views/user/ProfileView.vue'),
component: ProfileView,
children: [
{
path: '',
@ -322,8 +309,7 @@ const routes: Array<RouteRecordRaw> = [
{
path: '/statistics',
name: 'Statistics',
component: () =>
import(/* webpackChunkName: 'statistics' */ '@/views/StatisticsView.vue'),
component: StatisticsView,
meta: {
title: 'statistics.STATISTICS',
},
@ -331,8 +317,7 @@ const routes: Array<RouteRecordRaw> = [
{
path: '/users/:username',
name: 'User',
component: () =>
import(/* webpackChunkName: 'profile' */ '@/views/user/UserView.vue'),
component: UserView,
meta: {
title: 'administration.USER',
},
@ -340,10 +325,7 @@ const routes: Array<RouteRecordRaw> = [
{
path: '/workouts',
name: 'Workouts',
component: () =>
import(
/* webpackChunkName: 'workouts' */ '@/views/workouts/WorkoutsView.vue'
),
component: WorkoutsView,
meta: {
title: 'workouts.WORKOUT',
count: 0,
@ -352,8 +334,7 @@ const routes: Array<RouteRecordRaw> = [
{
path: '/workouts/:workoutId',
name: 'Workout',
component: () =>
import(/* webpackChunkName: 'workouts' */ '@/views/workouts/Workout.vue'),
component: Workout,
props: { displaySegment: false },
meta: {
title: 'workouts.WORKOUT',
@ -362,10 +343,7 @@ const routes: Array<RouteRecordRaw> = [
{
path: '/workouts/:workoutId/edit',
name: 'EditWorkout',
component: () =>
import(
/* webpackChunkName: 'workouts' */ '@/views/workouts/EditWorkout.vue'
),
component: EditWorkout,
meta: {
title: 'workouts.EDIT_WORKOUT',
},
@ -373,8 +351,7 @@ const routes: Array<RouteRecordRaw> = [
{
path: '/workouts/:workoutId/segment/:segmentId',
name: 'WorkoutSegment',
component: () =>
import(/* webpackChunkName: 'workouts' */ '@/views/workouts/Workout.vue'),
component: Workout,
props: { displaySegment: true },
meta: {
title: 'workouts.SEGMENT',
@ -384,10 +361,7 @@ const routes: Array<RouteRecordRaw> = [
{
path: '/workouts/add',
name: 'AddWorkout',
component: () =>
import(
/* webpackChunkName: 'workouts' */ '@/views/workouts/AddWorkout.vue'
),
component: AddWorkout,
meta: {
title: 'workouts.ADD_WORKOUT',
},
@ -395,8 +369,7 @@ const routes: Array<RouteRecordRaw> = [
{
path: '/admin',
name: 'Administration',
component: () =>
import(/* webpackChunkName: 'admin' */ '@/views/AdminView.vue'),
component: AdminView,
children: [
{
path: '',
@ -434,8 +407,7 @@ const routes: Array<RouteRecordRaw> = [
{
path: 'users/:username',
name: 'UserFromAdmin',
component: () =>
import(/* webpackChunkName: 'profile' */ '@/views/user/UserView.vue'),
component: UserView,
props: { fromAdmin: true },
meta: {
title: 'admin.USER',

View File

@ -8,36 +8,22 @@ export const loadLanguagePackage = async (language: string) => {
// fallback to english
switch (language) {
case 'fr':
return await import(
/* webpackChunkName: "password.fr" */ '@zxcvbn-ts/language-fr'
)
return await import('@zxcvbn-ts/language-fr')
case 'de':
return await import(
/* webpackChunkName: "password.de" */ '@zxcvbn-ts/language-de'
)
return await import('@zxcvbn-ts/language-de')
case 'it':
return await import(
/* webpackChunkName: "password.it" */ '@zxcvbn-ts/language-it'
)
return await import('@zxcvbn-ts/language-it')
case 'es':
return await import(
/* webpackChunkName: "password.es" */ '@zxcvbn-ts/language-es-es'
)
return await import('@zxcvbn-ts/language-es-es')
case 'pl':
return await import(
/* webpackChunkName: "password.pl" */ '@zxcvbn-ts/language-pl'
)
return await import('@zxcvbn-ts/language-pl')
default:
return await import(
/* webpackChunkName: "password.en" */ '@zxcvbn-ts/language-en'
)
return await import('@zxcvbn-ts/language-en')
}
}
export const setZxcvbnOptions = async (language: string) => {
const zxcvbnCommonPackage = await import(
/* webpackChunkName: "password" */ '@zxcvbn-ts/language-common'
)
const zxcvbnCommonPackage = await import('@zxcvbn-ts/language-common')
const zxcvbnLanguagePackage = await loadLanguagePackage(language)
const options = {
graphs: zxcvbnCommonPackage.adjacencyGraphs,

View File

@ -4,6 +4,8 @@ import path from 'path'
import vue from '@vitejs/plugin-vue'
import { defineConfig } from 'vite'
const zxcvbnRe = /@zxcvbn-ts\/language-(\w+-?\w+?)\//
// https://vitejs.dev/config/
export default defineConfig({
plugins: [vue()],
@ -11,15 +13,42 @@ export default defineConfig({
alias: {
'@': fileURLToPath(new URL('./src', import.meta.url)),
'~@/scss': fileURLToPath(new URL('./src/scss', import.meta.url)),
'~@/assets': fileURLToPath(new URL('./src/assets', import.meta.url))
}
'~@/assets': fileURLToPath(new URL('./src/assets', import.meta.url)),
},
},
server: {
port: 3000
port: 3000,
},
build: {
outDir: path.resolve(__dirname, '../fittrackee/dist'),
emptyOutDir: true,
assetsDir: 'static'
assetsDir: 'static',
rollupOptions: {
output: {
assetFileNames({ name }) {
if (name?.includes('pt-sans-v9-latin'))
return 'static/fonts/[name]-[hash][extname]'
if (name?.includes('.svg')) return 'static/img/[name]-[hash][extname]'
if (name?.includes('.css')) return 'static/css/[name]-[hash][extname]'
return 'static/[name]-[hash][extname]'
},
manualChunks: (id) => {
if (id.includes('@zxcvbn-ts/language-')) {
const matches = id.match(zxcvbnRe)
if (matches && matches.length === 2) {
return `password.${matches[1]}`
}
}
if (id.includes('node_modules')) {
if (
id.includes('/chart.js') ||
id.includes('/chartjs-plugin-datalabels')
)
return 'charts'
if (id.includes('/leaflet')) return 'maps'
}
},
},
},
},
})