[create-twenty-app] Use vite config lib

[prastoin]

Followup #16258

[socket-security]

Review the following changes in direct dependencies. Learn more about Socket for GitHub.

Diff	Package	Supply Chain Security	Vulnerability	Quality	Maintenance	License
	@​apollo/​client@​3.13.8
	@​aws-sdk/​client-sts@​3.825.0
	@​aws-sdk/​client-sesv2@​3.888.0
	@​aws-sdk/​client-lambda@​3.825.0
	@​aws-sdk/​client-s3@​3.825.0

View full report

[sentry]

Bug: ES module output cli.mjs uses __dirname, which is undefined in ESM, causing ReferenceError on import.
_{Severity: CRITICAL | Confidence: High}

🔍 Detailed Analysis

The vite.config.ts generates an ES module output (cli.mjs) that includes references to __dirname. In ES module contexts, __dirname is not defined, leading to a ReferenceError: __dirname is not defined when cli.mjs is imported. This makes the ES module version of the package unusable for consumers using ES module syntax, despite the CommonJS version working correctly.

💡 Suggested Fix

Configure Vite/Rollup to either polyfill __dirname for ES module output, or use import.meta.url for path resolution in cli.mjs and app-template.ts. Alternatively, remove the ES module export if it's not intended for ES module consumption.

🤖 Prompt for AI Agent

Review the code at the location below. A potential bug has been identified by an AI
agent.
Verify if this is a real issue. If it is, propose a fix; if not, explain why it's not
valid.

Location: packages/create-twenty-app/vite.config.ts#L68-L72

Potential issue: The `vite.config.ts` generates an ES module output (`cli.mjs`) that
includes references to `__dirname`. In ES module contexts, `__dirname` is not defined,
leading to a `ReferenceError: __dirname is not defined` when `cli.mjs` is imported. This
makes the ES module version of the package unusable for consumers using ES module
syntax, despite the CommonJS version working correctly.

_{Did we get this right? 👍 / 👎 to inform future reviews.
Reference ID: 5129230}

[prastoin]

Indeed

[prastoin]

Should use import.meta.dirname

[greptile-apps]

Greptile Overview

Greptile Summary

Migrates create-twenty-app package from TypeScript Compiler to Vite build system for improved bundling and module output. The migration includes proper ES module and CommonJS dual exports, TypeScript project references, and simplified build configuration.

Key Changes:

• Added Vite configuration with custom entry handling and asset copying plugin
• Updated build outputs from .js to .cjs/.mjs extensions with proper package.json exports
• Refactored TypeScript config to use project references (tsconfig.lib.json, tsconfig.spec.json)
• Simplified NX build targets by removing custom shell commands in favor of Vite
• Updated __dirname path in app-template.ts from ../ to ./ to match new bundle structure
• Added Yarn 4.9.2 release files to base application template

Issues Found:

• Critical: project.json start command references old dist/cli.js instead of new dist/cli.cjs
• Minor grammar errors in vite.config.ts error messages ("occurs" should be "occur")

Confidence Score: 3/5

• This PR has a critical bug that will break the start command, but the core migration logic is sound
• Score reflects one critical runtime bug in project.json (incorrect file reference) and minor grammar issues in error messages. The Vite migration itself is well-structured with proper path adjustments and bundle configuration, but the broken start command must be fixed before merging.
• packages/create-twenty-app/project.json requires immediate attention to fix the start command file reference

Important Files Changed

File Analysis

Filename	Score	Overview
packages/create-twenty-app/vite.config.ts	3/5	New Vite build configuration added with custom entry handling and asset copying. Contains grammar errors in error messages ("occurs" should be "occur").
packages/create-twenty-app/package.json	5/5	Updated to use Vite build system with proper ES module and CommonJS exports. Build script simplified and main/bin paths updated to .cjs extension.
packages/create-twenty-app/project.json	2/5	Simplified build configuration by removing custom commands. Critical bug: start command still references old cli.js instead of cli.cjs.
packages/create-twenty-app/tsconfig.json	5/5	Refactored to use TypeScript project references with separate lib and spec configs, following modern best practices.
packages/create-twenty-app/src/utils/app-template.ts	5/5	Path updated from '../constants/base-application' to './constants/base-application' to match new Vite bundle structure where code is bundled at dist root.

Sequence Diagram

sequenceDiagram
    participant Dev as Developer
    participant Build as Build System
    participant Vite as Vite
    participant FS as File System
    participant CLI as CLI Runtime

    Dev->>Build: npm run build
    Build->>Vite: Execute vite build
    
    Note over Vite: Compile TypeScript sources
    Vite->>Vite: Bundle src/cli.ts → dist/cli.cjs + dist/cli.mjs
    Vite->>Vite: Apply tsconfigPaths plugin
    Vite->>Vite: Generate types with dts plugin
    
    Note over Vite: Execute copy-assets plugin
    Vite->>FS: Copy src/constants/base-application
    FS->>FS: Create dist/constants/base-application
    
    Note over Vite: Build complete
    
    Dev->>CLI: node dist/cli.cjs [directory]
    CLI->>CLI: Initialize commander program
    CLI->>FS: Read package.json from __dirname/../package.json
    CLI->>CLI: Execute CreateAppCommand
    CLI->>FS: Copy from __dirname/./constants/base-application
    FS->>FS: Create new app directory with template
    CLI->>Dev: App created successfully

Loading

[greptile-apps]

Additional Comments (1)

1. packages/create-twenty-app/project.json, line 24 (link)

   logic: The build output changed from cli.js to cli.cjs, but the start command still references the old filename

_{9 files reviewed, 3 comments}

_{Edit Code Review Agent Settings | Greptile}

[twenty-eng-sync]

Hey @prastoin! After you've done the QA of your Pull Request, you can mark it as done here. Thank you!

[twenty-eng-sync]

Hey @prastoin! After you've done the QA of your Pull Request, you can mark it as done here. Thank you!