[vite] add vite.config.js and update npm commands

app/.eslintrc.js

@@ -1,6 +1,7 @@
 module.exports = {
   root: true,
   env: {
+    es2021: true,
     node: true
   },
   extends: [

app/package.json

@@ -5,11 +5,10 @@
   "description": "YunoHost Admin web interface",
   "author": "Yunohost",
   "scripts": {
-    "serve": "./node_modules/@vue/cli-service/bin/vue-cli-service.js serve",
-    "build": "./node_modules/@vue/cli-service/bin/vue-cli-service.js build",
-    "lint": "./node_modules/@vue/cli-service/bin/vue-cli-service.js lint --no-fix",
-    "i18n": "./node_modules/@vue/cli-service/bin/vue-cli-service.js i18n:report --src './src/**/*.?(js|vue)' --locales './src/i18n/locales/*.json'",
-    "i18n:en": "./node_modules/@vue/cli-service/bin/vue-cli-service.js i18n:report --src './src/**/*.?(js|vue)' --locales './src/i18n/locales/en.json'"
+    "dev": "vite",
+    "build": "vite build",
+    "lint": "eslint --ext .js,.vue src",
+    "lint-fix": "lint --fix"
   },
   "dependencies": {
     "@fontsource/fira-code": "^4.5.13",
@@ -33,8 +32,6 @@
     "popper.js": "^1.16.0",
     "portal-vue": "^2.1.7",
     "sass": "^1.60.0",
-    "sass-loader": "^13.2.1",
-    "sass-resources-loader": "^2.2.5",
     "standard": "^17.0.0",
     "vite": "^4.2.1"
   },

app/vite.config.js

@@ -0,0 +1,85 @@
+import { fileURLToPath, URL } from 'url';
+import { defineConfig, loadEnv } from 'vite'
+import fs from 'fs'
+import vue from '@vitejs/plugin-vue2'
+
+
+export default defineConfig(({ command, 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.
+  const env = loadEnv(mode, process.cwd())
+
+  const config = {
+    define: {
+      // fake process.env for some deps
+      'process.env': {}
+    },
+    resolve:{
+      alias:[
+        // this is required for the SCSS modules imports with `~` (node_modules)
+        { find: /^~(.*)$/, replacement: '$1' },
+        { find: '@', replacement: fileURLToPath(new URL('./src', import.meta.url)) },
+      ]
+    },
+    css: {
+      preprocessorOptions: {
+        scss: {
+          // To auto inject scss variables into componentns scope
+          additionalData: `
+            @import "@/scss/_variables.scss";
+          `
+        }
+      }
+    },
+    plugins: [
+      vue()
+    ],
+    build: {
+      rollupOptions: {
+        output: {
+          manualChunks: (id) => {
+            // Circular import problems, this will merge vue/vuex/etc. and api together
+            if (!id.includes('node_modules') && id.includes('api/')) {
+              return 'core';
+            }
+          }
+        }
+      }
+    }
+  }
+
+  if (mode === 'production') {
+    return {
+      ...config,
+      base: '/yunohost/admin',
+    }
+  } else if (mode === 'development') {
+    return {
+      ...config,
+      server: {
+        port: 8080,
+        host: env.VITE_IP,
+        https: {
+          // Use already created cert from yunohost instance
+          key: fs.readFileSync('/etc/yunohost/certs/yunohost.org/key.pem'),
+          cert: fs.readFileSync('/etc/yunohost/certs/yunohost.org/crt.pem'),
+        },
+        fs: {
+          // Needed for special ynh-dev context where node_modules is symlinked
+          allow: [
+            '/ynh-dev/yunohost-admin/app',
+            '/var/cache/ynh-dev/yunohost-admin/node_modules'
+          ]
+        },
+        proxy: {
+          '/yunohost': {
+            target: `https://${env.VITE_IP}`,
+            ws: true,
+            logLevel: 'info',
+            secure: false,
+          },
+        },
+      }
+    }
+  }
+})