Tinymist Typst installs statistics

<!-- This file is generated by scripts/link-docs.mjs. Do not edit manually. -->

Tinymist Typst VS Code Extension

HTML | Markdown

A VS Code or VS Codium extension for Typst. You can find the extension on:

• Stable and pre-release versions available at Visual Studio Marketplace and Open VSX.
• The artifacts built per commits at GitHub Actions.
• The artifacts built per release at GitHub Releases.

Features

See Tinymist Features for a list of features.

LLM-Assisted Documentation

The Software Specification contains user interface provided by this extension, You could find solutions by text search in the docs or ask LLMs with plugging the docs.

Configuration Reference

Configuration Reference.

Usage Tips

Initializing with a Template

To initialize a Typst project:

• Use command Typst init template (tinymist.initTemplate) to initialize a new Typst project based on a template.
• Use command Typst show template (tinymist.showTemplateGallery) to show available Typst templates for picking up a template to initialize.

🎉 If your template contains only a single file, you can also insert the template content in place with command:

• Use command Typst template in place (tinymist.initTemplateInPlace) and input a template specifier for initialization.

Configuring LSP-Enhanced Formatters

1. Open settings.
2. Search for “Tinymist Formatter” and modify the value.
   • Use "formatterMode": "typstyle" for typstyle.
   • Use "formatterMode": "typstfmt" for typstfmt.

Tips: to enable formatting on save, you should add extra settings for typst language:

{
  "[typst]": {
    "editor.formatOnSave": true
  }
}

Configuring Linter

1. Open settings.
2. Search for “Tinymist Lint” and modify the value.
   1. Toggle “Enabled” to enable or disable the linter.
   2. Change “When” to configure when the linter runs.
      • (Default) onSave run linting when you save the file.
      • onType run linting as you type.

Configuring/Using Tinymist’s Activity Bar (Sidebar)

If you don’t like the activity bar, you can right-click on the activity bar and uncheck “Tinymist” to hide it.

Symbol View

• Search symbols by keywords, descriptions, or handwriting.
• See symbols grouped by categories.
• Click on a symbol, then it will be inserted into the editor.

Tool View

• Template Gallery: Show available Typst templates for picking up a template to initialize.
• Document Summary: Show a summary of the current document.
• Symbols: Show symbols in the current document.
• Fonts: Show fonts in the current document.
• Profiling: Profile the current document.

Package View

• Create or open some local typst packages.
• Show a list of available typst packages and invoke associated commands.

Content View

• Show thumbnail content of the current document, which is useful for creating slides.

Label View

• Show labels in the current workspace.

Outline View

• Show outline of exported document, viewing typst as a markup language.
  • This is slightly different from the LSP-provided document outline, which shows the syntax structure of the document, viewing typst as a programming language.

Preview Command

Open command palette (Ctrl+Shift+P), and type >Typst Preview:.

You can also use the shortcut (Ctrl+K V).

Theme-aware template (previewing)

In short, there is a sys.inputs item added to the compiler when your document is under the context of user editing or previewing task. You can use it to configure your template:

#let preview-args = json.decode(sys.inputs.at("x-preview", default: "{}"))
// One is previewing the document.
#let is-preview = sys.inputs.has("x-preview")
// `dark` or `light`
#let preview-theme = preview-args.at("theme", default: "light")

For details, please check Preview’s sys.inputs.

Configuring path to search fonts

To configure path to search fonts:

1. Open settings.
   • File -> Preferences -> Settings (Linux, Windows).
   • Code -> Preferences -> Settings (Mac).
2. Search for “Tinymist Font Paths” for providing paths to search fonts order-by-order.
3. Search for “Tinymist System Fonts” for disabling system fonts to be searched, which is useful for reproducible rendering your PDF documents.
4. Reload the window or restart the vscode editor to make the settings take effect.

Note: you must provide absolute paths.

Note: you can use vscode variables in the settings, see vscode-variables for more information.

For a reproducible setup, the shared embedded-font inventory, and package-path examples that affect preview and export the same way, see Compiler Settings.

Configuring path to root directory

To configure the root path resolved for Typst compiler:

1. Open settings.
2. Search for “Tinymist Root Path” and modify the value.
3. Reload the window or restart the vscode editor to make the settings take effect. Note: you must provide absolute paths.

If you also need package paths, package cache paths, or certificate settings, refer to Compiler Settings for examples.

Managing Local Packages…