Skip to content

Instantly share code, notes, and snippets.

@muratkeremozcan
Last active August 30, 2024 15:03
Show Gist options
  • Save muratkeremozcan/3808bbb2b99a3504c999939ec68916b4 to your computer and use it in GitHub Desktop.
Save muratkeremozcan/3808bbb2b99a3504c999939ec68916b4 to your computer and use it in GitHub Desktop.
No node hassle vite config for cypress component tests in large repos
import react from '@vitejs/plugin-react' // the -swc version causes problems with cyct, use at your peril
import { polyfillNode } from 'esbuild-plugin-polyfill-node'
import path from 'path'
import type { PluginOption } from 'vite'
import { defineConfig } from 'vite'
import commonjsExternals from 'vite-plugin-commonjs-externals'
import { viteCommonjs } from '@originjs/vite-plugin-commonjs'
import webfontDownload from 'vite-plugin-webfont-dl'
export default defineConfig({
build: {
minify: false, // add logic to minify in deployments, skip in local
cssCodeSplit: false, // add logic to split CSS in deployments, skip in local
cssMinify: false, // add logic to minify CSS in deployments, skip in local
sourcemap: true, // add logic to enable sourcemaps in local, disable in deployments
// if this is a package
// lib: {
// formats: ['cjs', 'es'],
// entry: path.resolve(__dirname, './src/index.ts'),
// name: '@my-package-name',
// fileName: format => `@my-package-name',.${format}.js`,
// },
},
plugins: [
react(),
polyfillNode(),
// tsconfigPaths(), // if you have a separate tsconfig file, specify it here with an arg {projects: [path.resolve(rootDir, './tsconfig.build.json')]}
// prevent bundling of certain esm imported packages
// and instead retrieve these external dependencies at runtime by commonjs require.
viteCommonjs(),
webfontDownload([
'https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@400;700;800;900&display=swap',
]),
// transformEmotionStyled(), // if you have to deal with emotion
],
optimizeDeps: {
esbuildOptions: {
define: {
global: 'globalThis',
},
},
},
resolve: {
alias: {
'@support': path.resolve(__dirname, './cypress/support'),
'@fixtures': path.resolve(__dirname, './cypress/fixtures'),
},
},
define: {
'process.env.NODE_DEBUG': JSON.stringify(''),
},
assetsInclude: [
'**/*.png',
'**/*.png',
'**/*.jpe?g',
'**/*.gif',
'**/*.svg',
'**/*.ico',
'**/*.webp',
'**/*.avif',
],
})
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment