Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>DataTable EditorNew to Visual Studio Code? Get it now.
DataTable Editor

DataTable Editor

SteelWaffe7

|
1 install
| (0) | Free
Unreal Engine-style DataTable editor for TypeScript. Create and manage DataTables with a visual editor similar to Unreal Engine 5.
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

DataTable Editor for VS Code

A powerful VS Code extension that provides an Unreal Engine-style DataTable editor for TypeScript. Create and manage DataTables with a visual editor similar to Unreal Engine 5.

Features

  • Visual DataTable Editor: Create and edit DataTables with an intuitive UI
  • Structure Management: Define and modify your data structures (interfaces) on the fly
  • Row Management: Add, edit, duplicate, and delete rows easily
  • Search & Navigation: Powerful search functionality with navigation (Enter/Shift+Enter)
  • Array Support: Edit string[] and number[] fields with add/remove controls
  • Auto ID Generation: Configure automatic ID generation (number or UUID-like string)
  • Inline Editing: Double-click cells to edit values directly
  • Resizable Editor: Customize the row editor panel size
  • TypeScript Integration: Generates proper TypeScript files with interfaces

Usage

  1. Create a DataTable:

    • Open Command Palette (Ctrl+Shift+P / Cmd+Shift+P)
    • Run "DataTable: Create New Data Table"
    • Follow the wizard to set up your structure
  2. Edit DataTable:

    • Open any .dt.ts file
    • Use the visual editor to manage rows and structure
    • Right-click on .dt.ts files in Explorer for quick access
  3. Structure Editor:

    • Switch to "Data Table Details" tab
    • Add, remove, or modify properties
    • Configure ID field settings

File Format

DataTables are saved as TypeScript files with the .dt.ts extension:

// @datatable-{"hasIdField":true,"idFieldName":"id","idType":"number","idInitialValue":1}
interface ItemData {
    id: number;
    itemName: string;
    price: number;
    isStackable: boolean;
}

export const Items = [
    {
        id: 1,
        itemName: "Sword",
        price: 100,
        isStackable: false
    }
] as ItemData[];

Commands

  • DataTable: Create New Data Table - Create a new DataTable file
  • DataTable: Add New Row - Add a new row to the current DataTable
  • DataTable: Edit Structure - Edit the structure of the DataTable

Requirements

VS Code version 1.106.1 or higher.

Known Issues

None at the moment. Please report any issues on GitHub.

Release Notes

1.0.0

Initial release of DataTable Editor:

  • Visual DataTable editor with table view
  • Structure editor for managing data types
  • Row management (add, edit, duplicate, delete)
  • Search functionality with navigation
  • Array field support with add/remove controls
  • Auto ID generation (number or UUID-like string)
  • Inline cell editing
  • Resizable row editor panel

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

License

MIT

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft