Question 1

How to integrate Theo into a webpack build process?

Accepted Answer

Use Theo's Node.js API in a custom webpack plugin or script to generate token files during build time. For example, run theo.convert() in a pre-build step to output CSS or JSON, then import those assets into your application.

Question 2

Theo vs Style Dictionary: which is better for design tokens?

Accepted Answer

Theo offers more built-in formats and Handlebars-based customization, while Style Dictionary has a larger community and closer W3C spec alignment. Choose Theo if you need extensive pre-built outputs; opt for Style Dictionary for broader tooling ecosystem.

Question 3

How to create a custom format in Theo?

Accepted Answer

Use theo.registerFormat() with a Handlebars template string or JavaScript function. For instance, define a template that outputs tokens in a specific structure, leveraging built-in helpers like camelcase for string manipulation, as shown in the README examples.

Question 4

Can Theo generate TypeScript definitions for tokens?

Accepted Answer

No, Theo doesn't natively generate TypeScript definitions. However, you can create a custom format to output .d.ts files or use the JSON output and manually create interfaces, extending the pipeline for type safety.

Question 5

How to handle nested aliases in Theo?

Accepted Answer

Define aliases in separate YAML/JSON files and use the 'imports' key to include them. Theo resolves aliases automatically, allowing nested references, but ensure circular dependencies are avoided to prevent resolution errors.

Question 6

What's the performance of Theo with large token sets?

Accepted Answer

Theo processes tokens via convert() or convertSync(), which can handle thousands of tokens, but performance may degrade with complex custom transforms. Profile your build and consider caching outputs or splitting token files for optimization.

Theo

What is Theo?

Overview

Use Cases

Best For

Related Projects

Found a gem we're missing?

Not Ideal For

Pros & Cons

Pros

Cons

Frequently Asked Questions