Skip to content

Your first GenAI script

GenAIScript use stylized JavaScript with minimal syntax. They are stored as files (genaisrc/*.genai.mjs or genaisrc/*.genai.mts) in your project. The execution of a genaiscript creates the prompt that will be sent to the LLM.

  1. Use the > GenAiScript: Create new script... command in the command palette (Ctrl+Shift+P on Windows/Linux, ⇧⌘P on Mac) to create a new script.

    A search bar with the text "createn" entered, displaying a suggestion for "GenAIScript: Create new script..." in a dropdown menu.

  2. The resulting file will be placed in the genaisrc folder in your project.

    • Directorygenaisrc scripts are created here by default
      • genaiscript.d.ts (TypeScript type definitions)
      • jsconfig.json (TypeScript compiler configuration)
      • proofreader.genai.mjs

the Prompt

The execution of the GenAIScript generates a prompt (and more) that gets sent to the LLM model.

The $``...`` template string function formats and write the string to the prompt; which gets sent to the LLM.

poem.genai.mjs
$`Write a one sentence poem.`
👤 user
Write a one sentence poem.
🤖 assistant
Roses bloom, hearts swoon, under the silver moon.

the Context

GenAIScript exposes the context through the env variable. The context is implicitly defined by the location you start executing the script.

  • you can right click on a folder and the env.files will contain all the files nested in that folder.
  • you can right click on or in a file and the env.files will contain only that file.
  • you can run the script using the command line interface and specify content of env.files in the CLI arguments.
proofreader.genai.mjs
def("FILES", env.files)
👤 user
FILES:
```md file="src/samples/markdown.md"
---
title: What is Markdown? - Understanding Markdown Syntax
description: Learn about Markdown, a lightweight markup language for formatting plain text, its syntax, and how it differs from WYSIWYG editors.
keywords: Markdown, markup language, formatting, plain text, syntax
sidebar: mydoc_sidebar
---
What is Markdown?
Markdown is a lightweight markup language that you can use to add formatting elements to plaintext text documents. Created by John Gruber in 2004, Markdown is now one of the world’s most popular markup languages.
Using Markdown is different than using a WYSIWYG editor. In an application like Microsoft Word, you click buttons to format words and phrases, and the changes are visible immediately. Markdown isn’t like that. When you create a Markdown-formatted file, you add Markdown syntax to the text to indicate which words and phrases should look different.
For example, to denote a heading, you add a number sign before it (e.g., # Heading One). Or to make a phrase bold, you add two asterisks before and after it (e.g., **this text is bold**). It may take a while to get used to seeing Markdown syntax in your text, especially if you’re accustomed to WYSIWYG applications. The screenshot below shows a Markdown file displayed in the Visual Studio Code text editor....
```

the Task

The $ function is used to build the prompt text, it renders and writes the text to the prompt ($ is a template literal).

proofreader.genai.mjs
def("FILES", env.files)
$`You are an expert technical writer and proofreader.
Review the documents in FILE and report the 2 most important issues.`
👤 user
FILES:
```md file="src/samples/markdown.md"
---
title: What is Markdown? - Understanding Markdown Syntax
description: Learn about Markdown, a lightweight markup language for formatting plain text, its syntax, and how it differs from WYSIWYG editors.
keywords: Markdown, markup language, formatting, plain text, syntax
sidebar: mydoc_sidebar
---
What is Markdown?
Markdown is a lightweight markup language that you can use to add formatting elements to plaintext text documents. Created by John Gruber in 2004, Markdown is now one of the world’s most popular markup languages.
Using Markdown is different than using a WYSIWYG editor. In an application like Microsoft Word, you click buttons to format words and phrases, and the changes are visible immediately. Markdown isn’t like that. When you create a Markdown-formatted file, you add Markdown syntax to the text to indicate which words and phrases should look different.
For example, to denote a heading, you add a number sign before it (e.g., # Heading One). Or to make a phrase bold, you add two asterisks before and after it (e.g., **this text is bold**). It may take a while to get used to seeing Markdown syntax in your text, especially if you’re accustomed to WYSIWYG applications. The screenshot below shows a Markdown file displayed in the Visual Studio Code text editor....
```
You are an expert technical writer and proofreader.
Review the documents in FILE and report the 2 most important issues.
🤖 assistant
I reviewed the document in "src/samples/markdown.md" and found the following two important issues:
1. **Missing Consistency in Heading Styles**: The document lacks consistency in heading styles, which can make the structure of the content unclear. For instance, it should use either the "atx-style" (with # symbols for headings) or the "setext-style" (with underlining for headings) consistently throughout the document to maintain a clear visual hierarchy.
2. **Lack of Examples**: The document describes Markdown syntax but lacks concrete examples to illustrate how to use Markdown for formatting. Including examples would enhance the reader's understanding of the syntax and its practical application.
These are the two most important issues that need to be addressed in the document.

the Metadata

You can add a call to the script function to provides metadata about the script and the model. The metadata is used to display the script in the UI and configure the LLM model.

proofreader.genai.mjs
// the metadata
script({
// user interface
title: "Technical proofreading",
description: "Reviews the text as a tech writer.",
group: "documentation",
// model configuration
model: "large",
temperature: 0,
})
def("FILES", env.files)
$`You are an expert technical writer and proofreader.
Review the documents in FILE and report the 2 most important issues.`
👤 user
FILES:
```md file="src/samples/markdown.md"
---
title: What is Markdown? - Understanding Markdown Syntax
description: Learn about Markdown, a lightweight markup language for formatting plain text, its syntax, and how it differs from WYSIWYG editors.
keywords: Markdown, markup language, formatting, plain text, syntax
sidebar: mydoc_sidebar
---
What is Markdown?
Markdown is a lightweight markup language that you can use to add formatting elements to plaintext text documents. Created by John Gruber in 2004, Markdown is now one of the world’s most popular markup languages.
Using Markdown is different than using a WYSIWYG editor. In an application like Microsoft Word, you click buttons to format words and phrases, and the changes are visible immediately. Markdown isn’t like that. When you create a Markdown-formatted file, you add Markdown syntax to the text to indicate which words and phrases should look different.
For example, to denote a heading, you add a number sign before it (e.g., # Heading One). Or to make a phrase bold, you add two asterisks before and after it (e.g., **this text is bold**). It may take a while to get used to seeing Markdown syntax in your text, especially if you’re accustomed to WYSIWYG applications. The screenshot below shows a Markdown file displayed in the Visual Studio Code text editor....
```
You are an expert technical writer and proofreader.
Review the documents in FILE and report the 2 most important issues.
🤖 assistant
File src/samples/markdown.md:
1. **Missing Consistency in Heading Styles**: The document lacks consistency in heading styles. For instance, it uses both "What is Markdown?" and "What is Markdown" as headings. Consistency in heading styles is crucial for a professional and polished document.
2. **Lack of Visual Examples**: While the document explains Markdown syntax, it would benefit from visual examples to illustrate the formatting. Visual examples can enhance understanding, especially for readers who are new to Markdown.
These are the two most important issues in the document.

The title, description, and group properties are used to display the script in the UI and can be helpful when the user is searching for a script.

A screenshot of a text editor showing a task labeled "Technical proofreading" with the description "Reviews the text as a tech writer." A hyperlink labeled "documentation" is on the right.

Next steps