twenty/packages/twenty-front/vite.config.ts

58 lines
1.2 KiB
TypeScript
Raw Normal View History

Move frontend to Vite 5 (#2775) * merge squashed - A couple of CJS modules into ESM (config mostly) - Vite complains about node.js modules: fixed `useIsMatchingLocation.ts` > or use rollupOptions in vite.config.ts > ref: https://github.com/saleor/saleor-dashboard/blob/f0e4f59d97e2a8c3e22bd2af7b7ce68a361fc9a4/vite.config.js#L6 - Adjust Storybook to work with Vite: use @storybook/test - Use SWC for jest tranformations - Remove unused deps: - ts-jest: replaced with @swc/jest, typecheck by `tsc` - babel plugins - @svgr/plugin-jsx: not used - @testing-library/user-event: handled by @storybook/test - @typescript-eslint/utils: was not plugged in - tsup, esbuild-plugin-svgr: will look into that later - Install Vite required deps, and remove craco/webpack deps - Adjust SVG to work with Vite as components - Fixed `Step.tsx`: I dont know if one should be swaped for the other, but there should be no slash - Initial formating and linting: - removed empty object params - sorting imports, etc.. * prettier: fix pattern * coverage: sb coverage report isnt working * Add missing pieces * `yarn lint --fix` * fix: scripts permissions * tsc: cut errors in half * fix: remove `react-app-env.d.ts` * tsc: all fixed, except `react-data-grid` types issue * eslint: ignore env-config.js * eslint: Align ci with config * msw: bypass testing warnings ref: https://stackoverflow.com/questions/68024935/msw-logging-warnings-for-unhandled-supertest-requests * rebase: and fix things * Adjust to current `graphql-codegen` no ESM support * Remove vite plugin and use built-in methods * rebase: and some fixes * quick fix + `corepack use yarn@1.22.19` * Fix build errors --------- Co-authored-by: Charles Bochet <charles@twenty.com>
2023-12-10 18:22:43 +03:00
import react from '@vitejs/plugin-react-swc';
import { defineConfig, loadEnv } from 'vite';
import checker from 'vite-plugin-checker';
Move frontend to Vite 5 (#2775) * merge squashed - A couple of CJS modules into ESM (config mostly) - Vite complains about node.js modules: fixed `useIsMatchingLocation.ts` > or use rollupOptions in vite.config.ts > ref: https://github.com/saleor/saleor-dashboard/blob/f0e4f59d97e2a8c3e22bd2af7b7ce68a361fc9a4/vite.config.js#L6 - Adjust Storybook to work with Vite: use @storybook/test - Use SWC for jest tranformations - Remove unused deps: - ts-jest: replaced with @swc/jest, typecheck by `tsc` - babel plugins - @svgr/plugin-jsx: not used - @testing-library/user-event: handled by @storybook/test - @typescript-eslint/utils: was not plugged in - tsup, esbuild-plugin-svgr: will look into that later - Install Vite required deps, and remove craco/webpack deps - Adjust SVG to work with Vite as components - Fixed `Step.tsx`: I dont know if one should be swaped for the other, but there should be no slash - Initial formating and linting: - removed empty object params - sorting imports, etc.. * prettier: fix pattern * coverage: sb coverage report isnt working * Add missing pieces * `yarn lint --fix` * fix: scripts permissions * tsc: cut errors in half * fix: remove `react-app-env.d.ts` * tsc: all fixed, except `react-data-grid` types issue * eslint: ignore env-config.js * eslint: Align ci with config * msw: bypass testing warnings ref: https://stackoverflow.com/questions/68024935/msw-logging-warnings-for-unhandled-supertest-requests * rebase: and fix things * Adjust to current `graphql-codegen` no ESM support * Remove vite plugin and use built-in methods * rebase: and some fixes * quick fix + `corepack use yarn@1.22.19` * Fix build errors --------- Co-authored-by: Charles Bochet <charles@twenty.com>
2023-12-10 18:22:43 +03:00
import svgr from 'vite-plugin-svgr';
import tsconfigPaths from 'vite-tsconfig-paths';
type Checkers = Parameters<typeof checker>[0];
Move frontend to Vite 5 (#2775) * merge squashed - A couple of CJS modules into ESM (config mostly) - Vite complains about node.js modules: fixed `useIsMatchingLocation.ts` > or use rollupOptions in vite.config.ts > ref: https://github.com/saleor/saleor-dashboard/blob/f0e4f59d97e2a8c3e22bd2af7b7ce68a361fc9a4/vite.config.js#L6 - Adjust Storybook to work with Vite: use @storybook/test - Use SWC for jest tranformations - Remove unused deps: - ts-jest: replaced with @swc/jest, typecheck by `tsc` - babel plugins - @svgr/plugin-jsx: not used - @testing-library/user-event: handled by @storybook/test - @typescript-eslint/utils: was not plugged in - tsup, esbuild-plugin-svgr: will look into that later - Install Vite required deps, and remove craco/webpack deps - Adjust SVG to work with Vite as components - Fixed `Step.tsx`: I dont know if one should be swaped for the other, but there should be no slash - Initial formating and linting: - removed empty object params - sorting imports, etc.. * prettier: fix pattern * coverage: sb coverage report isnt working * Add missing pieces * `yarn lint --fix` * fix: scripts permissions * tsc: cut errors in half * fix: remove `react-app-env.d.ts` * tsc: all fixed, except `react-data-grid` types issue * eslint: ignore env-config.js * eslint: Align ci with config * msw: bypass testing warnings ref: https://stackoverflow.com/questions/68024935/msw-logging-warnings-for-unhandled-supertest-requests * rebase: and fix things * Adjust to current `graphql-codegen` no ESM support * Remove vite plugin and use built-in methods * rebase: and some fixes * quick fix + `corepack use yarn@1.22.19` * Fix build errors --------- Co-authored-by: Charles Bochet <charles@twenty.com>
2023-12-10 18:22:43 +03:00
// https://vitejs.dev/config/
export default defineConfig(({ command, mode }) => {
const env = loadEnv(mode, process.cwd(), '');
Move frontend to Vite 5 (#2775) * merge squashed - A couple of CJS modules into ESM (config mostly) - Vite complains about node.js modules: fixed `useIsMatchingLocation.ts` > or use rollupOptions in vite.config.ts > ref: https://github.com/saleor/saleor-dashboard/blob/f0e4f59d97e2a8c3e22bd2af7b7ce68a361fc9a4/vite.config.js#L6 - Adjust Storybook to work with Vite: use @storybook/test - Use SWC for jest tranformations - Remove unused deps: - ts-jest: replaced with @swc/jest, typecheck by `tsc` - babel plugins - @svgr/plugin-jsx: not used - @testing-library/user-event: handled by @storybook/test - @typescript-eslint/utils: was not plugged in - tsup, esbuild-plugin-svgr: will look into that later - Install Vite required deps, and remove craco/webpack deps - Adjust SVG to work with Vite as components - Fixed `Step.tsx`: I dont know if one should be swaped for the other, but there should be no slash - Initial formating and linting: - removed empty object params - sorting imports, etc.. * prettier: fix pattern * coverage: sb coverage report isnt working * Add missing pieces * `yarn lint --fix` * fix: scripts permissions * tsc: cut errors in half * fix: remove `react-app-env.d.ts` * tsc: all fixed, except `react-data-grid` types issue * eslint: ignore env-config.js * eslint: Align ci with config * msw: bypass testing warnings ref: https://stackoverflow.com/questions/68024935/msw-logging-warnings-for-unhandled-supertest-requests * rebase: and fix things * Adjust to current `graphql-codegen` no ESM support * Remove vite plugin and use built-in methods * rebase: and some fixes * quick fix + `corepack use yarn@1.22.19` * Fix build errors --------- Co-authored-by: Charles Bochet <charles@twenty.com>
2023-12-10 18:22:43 +03:00
/*
Using explicit env variables, there is no need to expose all of them (security).
*/
const { REACT_APP_SERVER_BASE_URL } = env;
const isBuildCommand = command === 'build';
const checkers: Checkers = {
typescript: {
tsconfigPath: 'tsconfig.app.json',
},
};
if (!isBuildCommand) {
checkers['eslint'] = {
lintCommand:
'eslint . --report-unused-disable-directives --max-warnings 0 --config .eslintrc.cjs',
};
}
Move frontend to Vite 5 (#2775) * merge squashed - A couple of CJS modules into ESM (config mostly) - Vite complains about node.js modules: fixed `useIsMatchingLocation.ts` > or use rollupOptions in vite.config.ts > ref: https://github.com/saleor/saleor-dashboard/blob/f0e4f59d97e2a8c3e22bd2af7b7ce68a361fc9a4/vite.config.js#L6 - Adjust Storybook to work with Vite: use @storybook/test - Use SWC for jest tranformations - Remove unused deps: - ts-jest: replaced with @swc/jest, typecheck by `tsc` - babel plugins - @svgr/plugin-jsx: not used - @testing-library/user-event: handled by @storybook/test - @typescript-eslint/utils: was not plugged in - tsup, esbuild-plugin-svgr: will look into that later - Install Vite required deps, and remove craco/webpack deps - Adjust SVG to work with Vite as components - Fixed `Step.tsx`: I dont know if one should be swaped for the other, but there should be no slash - Initial formating and linting: - removed empty object params - sorting imports, etc.. * prettier: fix pattern * coverage: sb coverage report isnt working * Add missing pieces * `yarn lint --fix` * fix: scripts permissions * tsc: cut errors in half * fix: remove `react-app-env.d.ts` * tsc: all fixed, except `react-data-grid` types issue * eslint: ignore env-config.js * eslint: Align ci with config * msw: bypass testing warnings ref: https://stackoverflow.com/questions/68024935/msw-logging-warnings-for-unhandled-supertest-requests * rebase: and fix things * Adjust to current `graphql-codegen` no ESM support * Remove vite plugin and use built-in methods * rebase: and some fixes * quick fix + `corepack use yarn@1.22.19` * Fix build errors --------- Co-authored-by: Charles Bochet <charles@twenty.com>
2023-12-10 18:22:43 +03:00
const plugins = [
react({ jsxImportSource: '@emotion/react' }),
Move frontend to Vite 5 (#2775) * merge squashed - A couple of CJS modules into ESM (config mostly) - Vite complains about node.js modules: fixed `useIsMatchingLocation.ts` > or use rollupOptions in vite.config.ts > ref: https://github.com/saleor/saleor-dashboard/blob/f0e4f59d97e2a8c3e22bd2af7b7ce68a361fc9a4/vite.config.js#L6 - Adjust Storybook to work with Vite: use @storybook/test - Use SWC for jest tranformations - Remove unused deps: - ts-jest: replaced with @swc/jest, typecheck by `tsc` - babel plugins - @svgr/plugin-jsx: not used - @testing-library/user-event: handled by @storybook/test - @typescript-eslint/utils: was not plugged in - tsup, esbuild-plugin-svgr: will look into that later - Install Vite required deps, and remove craco/webpack deps - Adjust SVG to work with Vite as components - Fixed `Step.tsx`: I dont know if one should be swaped for the other, but there should be no slash - Initial formating and linting: - removed empty object params - sorting imports, etc.. * prettier: fix pattern * coverage: sb coverage report isnt working * Add missing pieces * `yarn lint --fix` * fix: scripts permissions * tsc: cut errors in half * fix: remove `react-app-env.d.ts` * tsc: all fixed, except `react-data-grid` types issue * eslint: ignore env-config.js * eslint: Align ci with config * msw: bypass testing warnings ref: https://stackoverflow.com/questions/68024935/msw-logging-warnings-for-unhandled-supertest-requests * rebase: and fix things * Adjust to current `graphql-codegen` no ESM support * Remove vite plugin and use built-in methods * rebase: and some fixes * quick fix + `corepack use yarn@1.22.19` * Fix build errors --------- Co-authored-by: Charles Bochet <charles@twenty.com>
2023-12-10 18:22:43 +03:00
tsconfigPaths(),
svgr(),
checker(checkers),
];
Move frontend to Vite 5 (#2775) * merge squashed - A couple of CJS modules into ESM (config mostly) - Vite complains about node.js modules: fixed `useIsMatchingLocation.ts` > or use rollupOptions in vite.config.ts > ref: https://github.com/saleor/saleor-dashboard/blob/f0e4f59d97e2a8c3e22bd2af7b7ce68a361fc9a4/vite.config.js#L6 - Adjust Storybook to work with Vite: use @storybook/test - Use SWC for jest tranformations - Remove unused deps: - ts-jest: replaced with @swc/jest, typecheck by `tsc` - babel plugins - @svgr/plugin-jsx: not used - @testing-library/user-event: handled by @storybook/test - @typescript-eslint/utils: was not plugged in - tsup, esbuild-plugin-svgr: will look into that later - Install Vite required deps, and remove craco/webpack deps - Adjust SVG to work with Vite as components - Fixed `Step.tsx`: I dont know if one should be swaped for the other, but there should be no slash - Initial formating and linting: - removed empty object params - sorting imports, etc.. * prettier: fix pattern * coverage: sb coverage report isnt working * Add missing pieces * `yarn lint --fix` * fix: scripts permissions * tsc: cut errors in half * fix: remove `react-app-env.d.ts` * tsc: all fixed, except `react-data-grid` types issue * eslint: ignore env-config.js * eslint: Align ci with config * msw: bypass testing warnings ref: https://stackoverflow.com/questions/68024935/msw-logging-warnings-for-unhandled-supertest-requests * rebase: and fix things * Adjust to current `graphql-codegen` no ESM support * Remove vite plugin and use built-in methods * rebase: and some fixes * quick fix + `corepack use yarn@1.22.19` * Fix build errors --------- Co-authored-by: Charles Bochet <charles@twenty.com>
2023-12-10 18:22:43 +03:00
return {
// base: ,
envPrefix: 'REACT_APP_',
build: {
outDir: 'build',
},
Move frontend to Vite 5 (#2775) * merge squashed - A couple of CJS modules into ESM (config mostly) - Vite complains about node.js modules: fixed `useIsMatchingLocation.ts` > or use rollupOptions in vite.config.ts > ref: https://github.com/saleor/saleor-dashboard/blob/f0e4f59d97e2a8c3e22bd2af7b7ce68a361fc9a4/vite.config.js#L6 - Adjust Storybook to work with Vite: use @storybook/test - Use SWC for jest tranformations - Remove unused deps: - ts-jest: replaced with @swc/jest, typecheck by `tsc` - babel plugins - @svgr/plugin-jsx: not used - @testing-library/user-event: handled by @storybook/test - @typescript-eslint/utils: was not plugged in - tsup, esbuild-plugin-svgr: will look into that later - Install Vite required deps, and remove craco/webpack deps - Adjust SVG to work with Vite as components - Fixed `Step.tsx`: I dont know if one should be swaped for the other, but there should be no slash - Initial formating and linting: - removed empty object params - sorting imports, etc.. * prettier: fix pattern * coverage: sb coverage report isnt working * Add missing pieces * `yarn lint --fix` * fix: scripts permissions * tsc: cut errors in half * fix: remove `react-app-env.d.ts` * tsc: all fixed, except `react-data-grid` types issue * eslint: ignore env-config.js * eslint: Align ci with config * msw: bypass testing warnings ref: https://stackoverflow.com/questions/68024935/msw-logging-warnings-for-unhandled-supertest-requests * rebase: and fix things * Adjust to current `graphql-codegen` no ESM support * Remove vite plugin and use built-in methods * rebase: and some fixes * quick fix + `corepack use yarn@1.22.19` * Fix build errors --------- Co-authored-by: Charles Bochet <charles@twenty.com>
2023-12-10 18:22:43 +03:00
plugins,
server: {
// open: true,
port: 3001,
},
define: {
'process.env': {
Move frontend to Vite 5 (#2775) * merge squashed - A couple of CJS modules into ESM (config mostly) - Vite complains about node.js modules: fixed `useIsMatchingLocation.ts` > or use rollupOptions in vite.config.ts > ref: https://github.com/saleor/saleor-dashboard/blob/f0e4f59d97e2a8c3e22bd2af7b7ce68a361fc9a4/vite.config.js#L6 - Adjust Storybook to work with Vite: use @storybook/test - Use SWC for jest tranformations - Remove unused deps: - ts-jest: replaced with @swc/jest, typecheck by `tsc` - babel plugins - @svgr/plugin-jsx: not used - @testing-library/user-event: handled by @storybook/test - @typescript-eslint/utils: was not plugged in - tsup, esbuild-plugin-svgr: will look into that later - Install Vite required deps, and remove craco/webpack deps - Adjust SVG to work with Vite as components - Fixed `Step.tsx`: I dont know if one should be swaped for the other, but there should be no slash - Initial formating and linting: - removed empty object params - sorting imports, etc.. * prettier: fix pattern * coverage: sb coverage report isnt working * Add missing pieces * `yarn lint --fix` * fix: scripts permissions * tsc: cut errors in half * fix: remove `react-app-env.d.ts` * tsc: all fixed, except `react-data-grid` types issue * eslint: ignore env-config.js * eslint: Align ci with config * msw: bypass testing warnings ref: https://stackoverflow.com/questions/68024935/msw-logging-warnings-for-unhandled-supertest-requests * rebase: and fix things * Adjust to current `graphql-codegen` no ESM support * Remove vite plugin and use built-in methods * rebase: and some fixes * quick fix + `corepack use yarn@1.22.19` * Fix build errors --------- Co-authored-by: Charles Bochet <charles@twenty.com>
2023-12-10 18:22:43 +03:00
REACT_APP_SERVER_BASE_URL,
},
},
};
Move frontend to Vite 5 (#2775) * merge squashed - A couple of CJS modules into ESM (config mostly) - Vite complains about node.js modules: fixed `useIsMatchingLocation.ts` > or use rollupOptions in vite.config.ts > ref: https://github.com/saleor/saleor-dashboard/blob/f0e4f59d97e2a8c3e22bd2af7b7ce68a361fc9a4/vite.config.js#L6 - Adjust Storybook to work with Vite: use @storybook/test - Use SWC for jest tranformations - Remove unused deps: - ts-jest: replaced with @swc/jest, typecheck by `tsc` - babel plugins - @svgr/plugin-jsx: not used - @testing-library/user-event: handled by @storybook/test - @typescript-eslint/utils: was not plugged in - tsup, esbuild-plugin-svgr: will look into that later - Install Vite required deps, and remove craco/webpack deps - Adjust SVG to work with Vite as components - Fixed `Step.tsx`: I dont know if one should be swaped for the other, but there should be no slash - Initial formating and linting: - removed empty object params - sorting imports, etc.. * prettier: fix pattern * coverage: sb coverage report isnt working * Add missing pieces * `yarn lint --fix` * fix: scripts permissions * tsc: cut errors in half * fix: remove `react-app-env.d.ts` * tsc: all fixed, except `react-data-grid` types issue * eslint: ignore env-config.js * eslint: Align ci with config * msw: bypass testing warnings ref: https://stackoverflow.com/questions/68024935/msw-logging-warnings-for-unhandled-supertest-requests * rebase: and fix things * Adjust to current `graphql-codegen` no ESM support * Remove vite plugin and use built-in methods * rebase: and some fixes * quick fix + `corepack use yarn@1.22.19` * Fix build errors --------- Co-authored-by: Charles Bochet <charles@twenty.com>
2023-12-10 18:22:43 +03:00
});