{"id":12202,"library":"tty-table","title":"tty-table: Terminal and Browser Table Formatter","description":"tty-table is a versatile JavaScript library designed to render tabular data in various environments, including Node.js command-line interfaces, web browsers, and browser developer consoles. Currently at stable version 5.0.0, the library sees moderate release activity, with recent updates focusing on bug fixes and dependency management. Its key differentiators include extensive configuration options for headers, columns, and data rows, supporting custom formatters for cell values, and the ability to handle both static datasets and streaming data in terminal applications. Unlike some CLI table libraries, tty-table provides a unified API for both terminal and browser rendering, offering flexibility for developers building multi-platform tools or debugging in the browser console.","status":"active","version":"5.0.0","language":"javascript","source_language":"en","source_url":"https://github.com/tecfu/tty-table","tags":["javascript","table","table in bash","cli-table","terminal table","console table","cli table","console.table","ascii table","typescript"],"install":[{"cmd":"npm install tty-table","lang":"bash","label":"npm"},{"cmd":"yarn add tty-table","lang":"bash","label":"yarn"},{"cmd":"pnpm add tty-table","lang":"bash","label":"pnpm"}],"dependencies":[],"imports":[{"note":"While CommonJS `require` still works, ESM `import` is the recommended modern approach, especially when using TypeScript as the package ships with types.","wrong":"const Table = require('tty-table');","symbol":"Table","correct":"import { Table } from 'tty-table';"},{"note":"Type imports for configuration objects like TableOptions and HeaderItem enhance type safety and IDE autocompletion when defining table structures. Refer to the package's type definitions for a complete list of available types.","symbol":"TableOptions","correct":"import { Table, TableOptions, HeaderItem } from 'tty-table';"}],"quickstart":{"code":"import { Table } from 'tty-table';\n\nconst header = [\n  { value: \"Name\", align: \"left\", color: \"green\" },\n  { value: \"Age\", align: \"center\", width: 5 },\n  {\n    value: \"Occupation\",\n    formatter: (value: string) => value.toUpperCase(),\n    color: \"cyan\",\n    align: \"right\",\n    width: 20\n  }\n];\n\nconst rows = [\n  [\"Alice\", 30, \"Software Engineer\"],\n  [\"Bob\", 24, \"Data Scientist\"],\n  [\"Charlie\", 45, \"Project Manager\"],\n  [\"Diana\", 28, \"UX Designer\"]\n];\n\nconst options = {\n  borderStyle: \"solid\",\n  borderColor: \"blue\",\n  headerAlign: \"center\",\n  align: \"left\",\n  width: \"auto\"\n};\n\nconst t1 = new Table(header, rows, options);\nconsole.log(t1.render());\n\n// Example with a different data structure\nconst header2 = [\n  { value: \"Product\", align: \"left\" },\n  { value: \"Price (USD)\", align: \"right\",\n    formatter: (price: number) => `$${price.toFixed(2)}`\n  },\n  { value: \"In Stock\", align: \"center\" }\n];\n\nconst rows2 = [\n  { product: \"Laptop\", price: 1200.50, inStock: true },\n  { product: \"Mouse\", price: 25.99, inStock: false },\n  { product: \"Keyboard\", price: 75.00, inStock: true }\n];\n\nconst t2 = new Table(header2, rows2);\nconsole.log(t2.render());","lang":"typescript","description":"Demonstrates creating a basic table with custom headers, data (both array of arrays and array of objects), and rendering it to the console with styling and a custom formatter."},"warnings":[{"fix":"Ensure all `width` properties in your header configuration are explicitly defined as integers. Review layouts that might have implicitly relied on floating-point width calculations.","message":"Since v5.0.0, column widths are strictly coerced to integers. If you were previously relying on non-integer widths or specific float-to-int conversion behavior, your table layout might change.","severity":"breaking","affected_versions":">=5.0.0"},{"fix":"Use a traditional `function` declaration (`function(cellValue, ...){...}`) for `formatter` callbacks if you need to access `this` context for methods like `this.configure()` or `this.resetStyle()`.","message":"When using `formatter` functions for column-specific cell value transformations, fat arrow functions (`() => {}`) do not support scope overrides. This means features like `this.configure()` or `this.resetStyle()` within a formatter will not work correctly when defined as an arrow function.","severity":"gotcha","affected_versions":">=4.1.6"}],"env_vars":null,"last_verified":"2026-04-19T00:00:00.000Z","next_check":"2026-07-18T00:00:00.000Z","problems":[{"fix":"Use `const Table = require('tty-table');` for CommonJS environments or `import { Table } from 'tty-table';` for ES Modules.","cause":"Attempting to import `Table` using a CommonJS `require` statement in a way that expects a default export, or trying to destructure a CommonJS `require` call incorrectly.","error":"TypeError: Table is not a constructor"},{"fix":"Rewrite the `formatter` function using a traditional `function` keyword to ensure `this` context is correctly bound by `tty-table`:\n```javascript\n{\n  value: \"Column\",\n  formatter: function(cellValue, columnIndex, rowIndex, rowData, inputData) {\n    this.configure({ truncate: false }); // 'this' will now work\n    return cellValue;\n  }\n}\n```","cause":"This typically occurs when a `formatter` function is defined as an arrow function, which lexically binds `this`, preventing access to the `tty-table` specific `this` context (e.g., `this.configure`, `this.resetStyle`).","error":"Cannot read properties of undefined (reading 'configure') inside formatter"}],"ecosystem":"npm"}