Noodly Pasta Maker

    TypeScript icon, indicating that this package has built-in type declarations

    3.1.0 • Public • Published


    VS Code (microsoft/vscode) implements a "File Icon Theme" API which allows extensions to contribute file icon themes to the VS Code UI (see This package allows to use that implementation as a standalone "file icon theme engine" for other projects. It is a fork of microsoft/vscode, reduced to all code parts related to the theme engine. The compiled output is ES6 compliant with source maps, declarations, and declaration maps included.

    Minor changes to the code were necessary in order to allow standalone usage (e.g., there was a dependency on the product.json file of microsoft/vscode, this code parts were removed).
    See this link for all changes made to the VS Code source code.

    Credits go to microsoft/vscode for their awesome work!


    yarn add @pkerschbaum/code-oss-file-icon-theme @pkerschbaum/code-oss-file-service


    Read file icon theme from disk and create CSS rules and classnames

    1. Download a VS Code file icon theme (e.g. and put it somewhere in your project.
    2. Call loadFileIconThemeCssRules with a URI object pointing to the directory of the file icon theme. This will return the CSS rules for the icon theme.
    3. Put the CSS rule into the <head> of your application, and put the class show-file-icons in some common ancestor of the HTML elements which should receive the file icons (e.g., on a root <div> element). The CSS selectors of the theme engine expect that class to be present (this class can be removed/added to "toggle" the presence of file icons).
      The icon theme is now "active".
    4. Use getIconClasses to retrieve classnames which you have to put on the HTML element which should receive the icon.

    (optional) Register languages to get more accurate file icons

    File icon themes might provide icons not only for file extensions (e.g. ".js"), but also for "languages", like JavaScript, C#, etc.
    For any given file/folder, the "File Icon Theme" API will try to detect a language for that file/folder and if a language gets detected, the appropriate language file icon will be used. Out of the box, no language is registered (besides "plaintext" for .txt files, see microsoft/vscode/src/vs/editor/common/modes/modesRegistry.ts#L61-L70]).

    code-oss-file-icon-theme includes language configurations shipped with VS Code in ./static/language-extensions. You can call registerLanguagesOfExtensions with a URI object pointing to that directory to load these configurations.




    npm i @pkerschbaum/code-oss-file-icon-theme

    DownloadsWeekly Downloads






    Unpacked Size

    2.51 MB

    Total Files


    Last publish


    • pkerschbaum