[devex] add vite #5260
[devex] add vite #5260
Conversation
guillaumejparis
added
the
filigran team
| settings: { | ||
| react: { | ||
| version: 'detect', | ||
| }, | ||
| }, |
There was a problem hiding this comment.
Fix for the eslint plugin react warning "en passant"
| <!doctype html> | ||
| <html lang="en"> | ||
| <head> | ||
| <script>window.BASE_PATH = "%BASE_PATH%"</script> | ||
| <title>%APP_TITLE%</title> | ||
| <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> | ||
| <meta http-equiv="X-UA-Compatible" content="IE=edge"> | ||
| <meta name="viewport" content="width=device-width,initial-scale=1"> | ||
| <meta name="dеѕсrірtіоn" content="%APP_DESCRIPTION%"> | ||
| <link id="favicon" rel="shortcut icon" href="%APP_FAVICON%"> | ||
| <link id="manifest" rel="manifest" href="%APP_MANIFEST%"> | ||
| </head> | ||
| <body> | ||
| <noscript>You need to enable JavaScript to run this app.</noscript> | ||
| <div id="root"></div> | ||
| <script type="module" src="/src/front.tsx"></script> | ||
| </body> | ||
| </html> |
There was a problem hiding this comment.
For Vite to work we MUST have the index.html at the root
| "start": "yarn relay && node builder/dev/dev.js", | ||
| "dev": "yarn relay && vite", |
There was a problem hiding this comment.
At first vite is optin with the yarn dev command
| name: 'treat-js-files-as-jsx', | ||
| async transform(code, id) { | ||
| if (!id.match(/src\/.*\.js$/)) return null; | ||
| // Use the exposed transform from vite, instead of directly | ||
| // transforming with esbuild | ||
| return transformWithEsbuild(code, id, { | ||
| loader: 'tsx', | ||
| jsx: 'automatic', | ||
| }); | ||
| }, | ||
| }, |
There was a problem hiding this comment.
needed because we have js files with jsx inside
|
With the addition of Vite, a little performance problem has been spotted : at the first Vite launch a lot of files are downloaded by the browser (every src/ files + dependencies chunks), to ease this some main routes are now lazy loaded, in the future we maybe will use it to improve production first render. |
guillaumejparis
force-pushed
the
improvement/add-vite
branch
from
7f6902c to
840119f
Compare
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## master #5260 +/- ##
=======================================
Coverage 65.60% 65.60%
=======================================
Files 472 472
Lines 59160 59160
Branches 4328 4328
=======================================
Hits 38811 38811
Misses 20349 20349 ☔ View full report in Codecov by Sentry. |
| import * as path from 'node:path'; | ||
| import relay from 'vite-plugin-relay'; | ||
|
|
||
| // to avoid multiple reload when discovering new dependencies after a going on a lazy (not precedently) loaded route we pre optmize these dependencies |
There was a problem hiding this comment.
to avoid multiple reload AND to avoid changing every mui imports across the app
|
Tested ok, good job LGTM 🙌 We'll use the remaining time in this dev cycle to stabilize or, if this happens to be really a bad idea, revert the changes. |
Add vite for local development