enso/app/gui2/vite.config.ts
somebody1234 ebf4cd5c1f
Inline modules in app/ide-desktop/ (#10305)
- Remove unnecessary modules
- Remove `ts-plugin-namespace-auto-import` as it was a workaround to use the non-conventional `import *` convention
- Remove `esbuild-plugin-copy-directories` as it is unuse
- Inline modules that are only ever used once
- Inline `project-manager-shim` into `gui2` - it is only used during `gui2`'s dev mode
- Inline `content-config` into `client`
- Flatten `app/ide-desktop/lib/` to `app/ide-desktop/`
- Flatten `app/ide-desktop/lib/dashboard/` to `app/dashboard/`

# Important Notes
- As mentioned above, all remaining modules have been moved up from `app/ide-desktop/lib/` to `app/ide-desktop/`. It's not ideal but I'd rather hold off on moving them anywhere else before we have a consensus on what should go where.
- (That is to say, this may not be the final directory structure - but I figure it's fine to get *something* done so that hopefully the rest of the restructuring is simpler.)
2024-07-17 09:10:42 +00:00

108 lines
3.4 KiB
TypeScript

/// <reference types="histoire" />
import react from '@vitejs/plugin-react'
import vue from '@vitejs/plugin-vue'
import { getDefines, readEnvironmentFromFile } from 'enso-common/src/appConfig'
import { fileURLToPath } from 'node:url'
import postcssNesting from 'postcss-nesting'
import tailwindcss from 'tailwindcss'
import tailwindcssNesting from 'tailwindcss/nesting'
import { defineConfig, type Plugin } from 'vite'
import VueDevTools from 'vite-plugin-vue-devtools'
// @ts-expect-error
import * as tailwindConfig from 'enso-dashboard/tailwind.config'
import { createGatewayServer } from './ydoc-server'
const projectManagerUrl = 'ws://127.0.0.1:30535'
const IS_CLOUD_BUILD = process.env.CLOUD_BUILD === 'true'
const POLYGLOT_YDOC_SERVER = process.env.POLYGLOT_YDOC_SERVER
await readEnvironmentFromFile()
const entrypoint = process.env.E2E === 'true' ? './src/e2e-entrypoint.ts' : './src/entrypoint.ts'
// https://vitejs.dev/config/
export default defineConfig({
root: fileURLToPath(new URL('.', import.meta.url)),
cacheDir: fileURLToPath(new URL('../../node_modules/.cache/vite', import.meta.url)),
publicDir: fileURLToPath(new URL('./public', import.meta.url)),
envDir: fileURLToPath(new URL('.', import.meta.url)),
plugins: [
VueDevTools(),
vue(),
react({
include: fileURLToPath(new URL('../dashboard/**/*.tsx', import.meta.url)),
babel: { plugins: ['@babel/plugin-syntax-import-attributes'] },
}),
gatewayServer(),
...(process.env.NODE_ENV === 'development' ? [await projectManagerShim()] : []),
],
optimizeDeps: {
entries: fileURLToPath(new URL('./index.html', import.meta.url)),
},
server: {
headers: {
'Cross-Origin-Opener-Policy': 'same-origin',
'Cross-Origin-Resource-Policy': 'same-origin',
},
},
resolve: {
alias: {
'/src/entrypoint.ts': fileURLToPath(new URL(entrypoint, import.meta.url)),
shared: fileURLToPath(new URL('./shared', import.meta.url)),
'@': fileURLToPath(new URL('./src', import.meta.url)),
},
},
define: {
...getDefines(),
IS_CLOUD_BUILD: JSON.stringify(IS_CLOUD_BUILD),
PROJECT_MANAGER_URL: JSON.stringify(projectManagerUrl),
YDOC_SERVER_URL: JSON.stringify(POLYGLOT_YDOC_SERVER),
RUNNING_VITEST: false,
'import.meta.vitest': false,
// Single hardcoded usage of `global` in aws-amplify.
'global.TYPED_ARRAY_SUPPORT': true,
},
esbuild: {
dropLabels: process.env.NODE_ENV === 'development' ? [] : ['DEV'],
},
assetsInclude: ['**/*.yaml', '**/*.svg'],
css: {
postcss: {
plugins: [
tailwindcssNesting(postcssNesting()),
tailwindcss({
...tailwindConfig.default,
content: tailwindConfig.default.content.map((glob: string) =>
glob.replace(/^[.][/]/, fileURLToPath(new URL('../dashboard/', import.meta.url))),
),
}),
],
},
},
build: {
// dashboard chunk size is larger than the default warning limit
chunkSizeWarningLimit: 700,
},
})
function gatewayServer(): Plugin {
return {
name: 'gateway-server',
configureServer({ httpServer }) {
if (httpServer == null || POLYGLOT_YDOC_SERVER != undefined) return
createGatewayServer(httpServer, undefined)
},
}
}
async function projectManagerShim(): Promise<Plugin> {
const module = await import('./project-manager-shim-middleware')
return {
name: 'project-manager-shim',
configureServer(server) {
server.middlewares.use(module.default)
},
}
}