@ -1,5 +1,5 @@
/// <reference types="vitest" />
import { defineConfig , type PluginOption } from 'vite'
import { defineConfig , type PluginOption , loadEnv } from 'vite'
import vue from '@vitejs/plugin-vue'
import legacyFn from '@vitejs/plugin-legacy'
import { URL , fileURLToPath } from 'node:url'
@ -49,136 +49,143 @@ function createFontMatcher(fontNames: string[]) {
}
// https://vitejs.dev/config/
export default defineConfig ( {
base : process.env.VIKUNJA_FRONTEND_BASE ,
// https://vitest.dev/config/
test : {
environment : 'happy-dom' ,
} ,
css : {
preprocessorOptions : {
scss : {
additionalData : PREFIXED_SCSS_STYLES ,
charset : false , // fixes "@charset" must be the first rule in the file" warnings
export default defineConfig ( ( { mode } ) = > {
// Load env file based on `mode` in the current working directory.
// Set the third parameter to '' to load all env regardless of the `VITE_` prefix.
// https://vitejs.dev/config/#environment-variables
const env = loadEnv ( mode , process . cwd ( ) , '' )
return {
base : env.VIKUNJA_FRONTEND_BASE ,
// https://vitest.dev/config/
test : {
environment : 'happy-dom' ,
} ,
css : {
preprocessorOptions : {
scss : {
additionalData : PREFIXED_SCSS_STYLES ,
charset : false , // fixes "@charset" must be the first rule in the file" warnings
} ,
} ,
postcss : {
plugins : [
postcssEasings ( ) ,
postcssEasingGradients ( ) ,
postcssPresetEnv ( ) ,
] ,
} ,
} ,
postcss : {
plugins : [
postcssEasings ( ) ,
postcssEasingGradients ( ) ,
postcssPresetEnv ( ) ,
plugins : [
vue ( {
reactivityTransform : true ,
} ) ,
legacy ,
svgLoader ( {
// Since the svgs are already manually optimized via https://jakearchibald.github.io/svgomg/
// we don't need to optimize them again.
svgo : false ,
} ) ,
VueI18nPlugin ( {
// TODO: only install needed stuff
// Whether to install the full set of APIs, components, etc. provided by Vue I18n.
// By default, all of them will be installed.
fullInstall : true ,
include : resolve ( dirname ( pathSrc ) , './src/i18n/lang/**' ) ,
} ) ,
// https://github.com/Applelo/vite-plugin-inject-preload
VitePluginInjectPreload ( {
files : [ {
match : createFontMatcher ( [ 'Quicksand' , 'OpenSans' , 'OpenSans-Italic' ] ) ,
attributes : { crossorigin : 'anonymous' } ,
} ] ,
injectTo : 'custom' ,
} ) ,
VitePWA ( {
srcDir : 'src' ,
filename : 'sw.ts' ,
strategies : 'injectManifest' ,
injectRegister : false ,
manifest : {
name : 'Vikunja' ,
short_name : 'Vikunja' ,
theme_color : '#1973ff' ,
icons : [
{
src : './images/icons/android-chrome-192x192.png' ,
sizes : '192x192' ,
type : 'image/png' ,
} ,
{
src : './images/icons/android-chrome-512x512.png' ,
sizes : '512x512' ,
type : 'image/png' ,
} ,
{
src : './images/icons/icon-maskable.png' ,
sizes : '1024x1024' ,
type : 'image/png' ,
purpose : 'maskable' ,
} ,
] ,
start_url : '.' ,
display : 'standalone' ,
background_color : '#000000' ,
shortcuts : [
{
name : 'Overview' ,
url : '/' ,
} ,
{
name : 'Namespaces And Lists Overview' ,
short_name : 'Namespaces & Lists' ,
url : '/namespaces' ,
} ,
{
name : 'Tasks Next Week' ,
short_name : 'Next Week' ,
url : '/tasks/by/week' ,
} ,
{
name : 'Tasks Next Month' ,
short_name : 'Next Month' ,
url : '/tasks/by/month' ,
} ,
{
name : 'Teams Overview' ,
short_name : 'Teams' ,
url : '/teams' ,
} ,
] ,
} ,
} ) ,
] ,
resolve : {
alias : [
{
find : '@' ,
replacement : pathSrc ,
} ,
] ,
extensions : [ '.mjs' , '.js' , '.ts' , '.jsx' , '.tsx' , '.json' , '.vue' ] ,
} ,
} ,
plugins : [
vue ( {
reactivityTransform : true ,
} ) ,
legacy ,
svgLoader ( {
// Since the svgs are already manually optimized via https://jakearchibald.github.io/svgomg/
// we don't need to optimize them again.
svgo : false ,
} ) ,
VueI18nPlugin ( {
// TODO: only install needed stuff
// Whether to install the full set of APIs, components, etc. provided by Vue I18n.
// By default, all of them will be installed.
fullInstall : true ,
include : resolve ( dirname ( pathSrc ) , './src/i18n/lang/**' ) ,
} ) ,
// https://github.com/Applelo/vite-plugin-inject-preload
VitePluginInjectPreload ( {
files : [ {
match : createFontMatcher ( [ 'Quicksand' , 'OpenSans' , 'OpenSans-Italic' ] ) ,
attributes : { crossorigin : 'anonymous' } ,
} ] ,
injectTo : 'custom' ,
} ) ,
VitePWA ( {
srcDir : 'src' ,
filename : 'sw.ts' ,
strategies : 'injectManifest' ,
injectRegister : false ,
manifest : {
name : 'Vikunja' ,
short_name : 'Vikunja' ,
theme_color : '#1973ff' ,
icons : [
{
src : './images/icons/android-chrome-192x192.png' ,
sizes : '192x192' ,
type : 'image/png' ,
} ,
{
src : './images/icons/android-chrome-512x512.png' ,
sizes : '512x512' ,
type : 'image/png' ,
} ,
{
src : './images/icons/icon-maskable.png' ,
sizes : '1024x1024' ,
type : 'image/png' ,
purpose : 'maskable' ,
} ,
] ,
start_url : '.' ,
display : 'standalone' ,
background_color : '#000000' ,
shortcuts : [
{
name : 'Overview' ,
url : '/' ,
} ,
{
name : 'Namespaces And Lists Overview' ,
short_name : 'Namespaces & Lists' ,
url : '/namespaces' ,
} ,
{
name : 'Tasks Next Week' ,
short_name : 'Next Week' ,
url : '/tasks/by/week' ,
} ,
{
name : 'Tasks Next Month' ,
short_name : 'Next Month' ,
url : '/tasks/by/month' ,
} ,
{
name : 'Teams Overview' ,
short_name : 'Teams' ,
url : '/teams' ,
} ,
server : {
host : '127.0.0.1' , // see: https://github.com/vitejs/vite/pull/8543
port : 4173 ,
strictPort : true ,
} ,
build : {
target : 'esnext' ,
rollupOptions : {
plugins : [
visualizer ( {
filename : 'stats.html' ,
gzipSize : true ,
// template: 'sunburst',
// brotliSize: true,
} ) as PluginOption ,
] ,
} ,
} ) ,
] ,
resolve : {
alias : [
{
find : '@' ,
replacement : pathSrc ,
} ,
] ,
extensions : [ '.mjs' , '.js' , '.ts' , '.jsx' , '.tsx' , '.json' , '.vue' ] ,
} ,
server : {
host : '127.0.0.1' , // see: https://github.com/vitejs/vite/pull/8543
port : 4173 ,
strictPort : true ,
} ,
build : {
target : 'esnext' ,
rollupOptions : {
plugins : [
visualizer ( {
filename : 'stats.html' ,
gzipSize : true ,
// template: 'sunburst',
// brotliSize: true,
} ) as PluginOption ,
] ,
} ,
} ,
}
} )