feat(ui): move to vite

.github/CONTRIBUTING.md

@@ -64,18 +64,18 @@ The frontend is located on `/ui` folder.
 - `npm install`
 - create a files `ui/.env.development.local` with content `VUE_APP_API_URL=http://localhost:8080` (or your actual server url)
 - `npm run serve` will start the development server with hot reload.
-- The server start by default on port 8090 and is reachable on `http://localhost:8090`
-- You can run `npm run build` in order to build the front-end that will be delivered from the 
+- The server start by default on port 8090 and is reachable on `http://localhost:5173`
+- You can run `npm run build` in order to build the front-end that will be delivered from the
 backend (without running the `npm serve`) above.
 
-> If you have CORS restrictions when using the local development npm server, you need to configure 
-> the backend to allow the http://localhost:8090 origin
+> If you have CORS restrictions when using the local development npm server, you need to configure
+> the backend to allow the http://localhost:5173 origin
 > ```cors:
 > enabled: true
 > configurations:
 > all:
 > allowedOrigins:
-> - http://localhost:8090```
+> - http://localhost:5173```
 
 #### Develop plugins
 A complete documentation for developing plugin can be found [here](https://kestra.io/docs/plugin-developer-guide/).

.github/workflows/main.yml

@@ -37,7 +37,7 @@ jobs:
  architecture: 'x64'
  - uses: actions/setup-node@v3
  with:
- node-version: '14'
+ node-version: '18'
  check-latest: true
 
  # Services

ui/.eslintrc.json

@@ -43,8 +43,5 @@
  "vue/multi-word-component-names": [
  "off"
  ]
- },
- "parserOptions": {
- "parser": "@babel/eslint-parser"
  }
 }

ui/build.gradle

@@ -5,7 +5,9 @@ plugins {
 publishSonatypePublicationPublicationToSonatypeRepository.enabled = false
 
 frontend {
- nodeVersion = '14.15.4'
+ nodeVersion = '18.12.1'
+ // due to vue-chart-3: https:/victorgarciaesgi/vue-chart-3/pull/138
+ installScript = 'install --legacy-peer-deps'
  assembleScript = 'run build'
  checkScript = 'run test:unit'
 }
@@ -20,6 +22,6 @@ tasks.named('assembleFrontend') {
 
  inputs.dir('src')
  inputs.dir('public')
- inputs.files('vue.config.js')
+ inputs.files('vite.config.js')
  outputs.dir('../webserver/src/main/resources/ui')
 }

ui/public/index.html → ui/index.html

@@ -5,15 +5,15 @@
  <title>Kestra</title>
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
- <link rel="icon" href="<%= BASE_URL %>favicon.ico">
- <link rel="icon" type="image/png" sizes="192x192" href="<%= BASE_URL %>favicon-192x192.png">
+ <link rel="icon" href="/favicon.ico">
+ <link rel="icon" type="image/png" sizes="192x192" href="/favicon-192x192.png">
  <meta name="msapplication-TileColor" content="#192A4E">
  <meta name="theme-color" content="#192A4E">
- <link rel="stylesheet" href="<%= BASE_URL %>loader.css" />
+ <link rel="stylesheet" href="/loader.css" />
  <meta name="html-head" content="replace">
  <script>
  const KESTRA_GOOGLE_ANALYTICS = null;
- const KESTRA_UI_PATH = "<%= BASE_URL %>";
+ const KESTRA_UI_PATH = "/ui/";
  const KESTRA_BASE_PATH = function () {
  const split = KESTRA_UI_PATH.split('/');
  split.pop();
@@ -38,6 +38,7 @@
  <div id="app-container">
  <div id="app"></div>
  </div>
- <!-- built files will be auto injected -->
+
+ <script type="module" src="/src/main.js"></script>
 </body>
 </html>