# Remove Components from telerik-blazor.js

## Environment

<table>
    <tbody>
        <tr>
            <td>Product</td>
            <td>
                UI for Blazor, <br />
                PDF Viewert for Blazor, <br />
                Spreadsheet for Blazor
            </td>
        </tr>
    </tbody>
</table>

## Description

This KB article answers the following questions:

* How to build the `telerik-blazor.js` file without some of the components?
* How to exclude components from the Telerik Blazor JSInterop file and rebuild `telerik-blazor.js`?
* How to remove components from the client-side code of Telerik UI for Blazor?
* How to remove the Spreadsheet component from `telerik-blazor.js` in order to achieve [strict Content Security Policy compliance](https://www.telerik.com/blazor-ui/documentation/troubleshooting/csp)?
* How to remove the PDF Viewer component from `telerik-blazor.js` in order to avoid conflicts with other third-party tools that depend on PDF.js?
* How to reduce the file size of the Telerik Blazor JavaScript asset?

## Solution

Here are the required steps to exclude Telerik UI for Blazor components from `telerik-blazor.js` and rebuild the Telerik JSInterop file.

1. Login to your [Telerik account](https://www.telerik.com/account/).
2. [Download the source code of Telerik UI for Blazor](https://www.telerik.com/account/downloads/product-download?product=BLAZOR).
3. Read the `Readme.txt` in the root folder of the downloaded ZIP archive. It provides information about JavaScript build pre-requisites and where to find the newly built file.
4. Delete the unwanted component folder from `/javascript/src/`, for example:
   * `pdf-viewer` for the PDF Viewer
   * `spreadsheet` for the Spreadsheet
5. Remove the `export` statement for the unwanted component from `/javascript/src/main.ts`, for example:
   * `export * from './pdf-viewer/main';` for the PDF Viewer
   * `export * from './spreadsheet/main';` for the Spreadsheet
6. Remove any existing dependencies for the unwanted component from `/javascript/package.json`, for example:
   * `@progress/kendo-pdfviewer-common` for the PDF Viewer
   * `@progress/kendo-spreadsheet-common` for the Spreadsheet
7. Delete `/javascript/package-lock.json`
8. Run `npm install` in the `javascript` folder.
9. Run `gulp build-cdn` in the `javascript` folder.
10. Copy the generated `telerik-blazor.js` file to the `wwwroot` folder or your Blazor app.
11. Remove the existing `telerik-blazor.js` file registration as a [static asset](https://www.telerik.com/blazor-ui/documentation/getting-started/workflow-details#javascript-file) or [CDN URL](https://www.telerik.com/blazor-ui/documentation/common-features/cdn#javascript-urls). Register the custom `telerik-blazor.js` from `wwwroot`.

> Repeat the above steps and rebuild `telerik-blazor.js` after every [version update of Telerik UI for Blazor](https://www.telerik.com/blazor-ui/documentation/upgrade/overview).

## See Also

* [Adding Telerik UI for Blazor to a Blazor app](https://www.telerik.com/blazor-ui/documentation/getting-started/workflow-details)