Тelerik Reporting Productivity Tools for Visual Studio Code

The extension automates the MCP server setup for you. The MCP Server enables you to use the AI Coding Assistant — an AI-powered code generator that provides proprietary context to produce high-quality code samples using Telerik Reporting components and APIs.

Telerik Reporting MCP Configuration

Provides automated configuration commands for the Telerik AI-powered development tools. These commands help you quickly set up the Telerik MCP server for enhanced developer productivity with Telerik Reporting components.

Configure MCP Server

The Telerik Reporting: Configure MCP Server command provides two configuration scopes to set up the Telerik Reporting MCP Server:

• Workspace—Creates an mcp.json file in a .vscode folder in your current workspace. This configuration applies only to the current workspace.
• Global—Creates an mcp.json file in your operating system user folder (for example, C:\Users\___\AppData\Roaming\Code\User\.mcp.json on Windows or /Users/___/Library/Application Support/Code/User/mcp.json on macOS). This configuration applies to all VS Code workspaces.

Installation Methods

Telerik Reporting MCP Server supports three installation methods:

1. DNX (Direct Native Execution)

• Requirements: .NET 10 SDK/Runtime installed
• Benefits: Native .NET execution for optimal performance and full feature support
• Configuration:
  • Server name: telerik-reporting-assistant
  • Transport: stdio
  • Command: dnx Telerik.Reporting.MCP --yes

2. Tool Install (.NET Tool)

• Requirements: .NET SDK installed, tool installed via dotnet tool install
• Benefits: Versioned installation, supports global or custom path installation
• Configuration:
  • Server name: telerik-reporting-assistant
  • Transport: stdio
  • Command: dotnet tool run telerik-reporting-mcp
• Installation: The extension will prompt you to install the tool globally or to a custom path

3. Node.js (NPX)

• Requirements: Node.js installed
• Benefits: Cross-platform compatibility, automatic package management
• Configuration:
  • Server name: telerikReportingAssistant
  • Transport: stdio
  • Command: npx -y @progress/telerik-reporting-mcp@latest
  • Environment: Automatically sets TELERIK_LICENSE_PATH to your Telerik license file path
• Note: Some advanced features may have limited support with this method

The extension will prompt you to choose your preferred installation method when configuring the MCP server. All methods automatically handle license key configuration through environment variables.

Sample Usage and Prompt Library

By default, MCP clients do not call MCP tools in a deterministic way. Some MCP clients like VS Code allow you to explicitly reference the desired MCP tool in your prompt.

• Learn how to use the Telerik Reporting MCP Server
• Browse the Prompt Library for sample prompts and usage examples

Add GitHub Copilot Custom Instructions

The Telerik Reporting: Add GitHub Copilot Custom Instructions - command generates a copilot-instructions.md file in the .github folder under the solution. This file contains custom instructions that help GitHub Copilot provide better assistance when working with Telerik Reporting components. The generated file includes the following default instructions:

• Guidance to use the Telerik MCP Server whenever applicable
• Guidance to prioritize the usage of Telerik Reporting
• Guidance to use best coding practices related to Telerik Reporting

If the file already exists, the default Telerik Reporting Copilot instructions will be added to the existing content.

Overview of Telerik Reporting Angular Scaffolding

Тhe Telerik Reporting Productivity Tools extension provides scaffolding for the Telerik Reporting native Angular viewer.

To create a new test app, you can use the Angular CLI:

ng new ReportingAngularApp

1. In VS Code, in the Explorer, within your Angular application source folder, right-click where you want to add a reporting component and select New Telerik Reporting Angular Project Item.

2. VS Code will prompt you that @progress/telerik-reporting-schematics is missing. To install it, click npm i ... in the prompt.

3. The Telerik Reporting Angular Scaffolding wizard will open, showing the available Angular component options.

4. Configure your preferred options and click Create. This will generate an Angular component with a pre-configured Telerik Reporting Native Angular report viewer.

5. Include the new component in your project. Add it to your routing or to the HTML of an existing component.

Extensions Settings

The Telerik Reporting Productivity Tools extension now includes configurable settings for managing product update notifications directly within Visual Studio Code. This update provides users with greater control over their development environment, allowing them to easily enable or disable update alerts according to their preferences.

1. Go to setting menu in VS Code and select "Settings" option from the context menu.

2. Go to "User" -> "Extensions" section:

3. Select "Telerik Reporting":

4. See the option that lets the user to enable or disable the product update notifications.

Help Resources

• Learn More about Telerik Reporting
• Telerik Reporting Documentation
• Telerik Reporting Online Demos
• Telerik Reporting Community Forums
• Suggest a Feature for Telerik Reporting
• Contact the Telerik Reporting Support

License

This code is distributed under the terms and conditions of the Progress Software Corporation End User License Agreement for Visual Studio Code Extensions.