Getting Started

Creating a Plugin Project (TODO)

To create a new plugin, run the following command in your terminal:

npm

npm create flowlauncher-plugin

yarn

yarn create flowlauncher-plugin

pnpm

pnpm create flowlauncher-plugin

bun

bun create flowlauncher-plugin

It will ask you a few questions about your plugin, such as the name, description, author, and the language you want to use (JavaScript or TypeScript) and it will create the project. Now open your index.js or index.ts (based on the language you chose) and see your plugin class that extends the FlowPlugin class:

index.js

@FlowPlugin.Class
export class MyPlugin extends FlowPlugin {
}

That’s it! You’ve created your first plugin. Now you can run the following command to build your plugin:

npm

npm run build

yarn

yarn build

pnpm

pnpm run build

bun

bun run build

The plugin will end up in the dist folder of your project. Now you can create a new folder, usually called PluginName-PluginVersion (i.e. My Website Search-1.0.0) in the Plugins folder of Flow Launcher. To find this folder, type userdata folder in Flow Launcher and then open the Plugins folder. Copy the contents of the dist folder in your project to this new folder and restart Flow Launcher. Voila! You just created your first plugin. Of course, it doesn’t do anything yet, but we’ll get to that in the next section.

Note

Throughout this guide, you’ll see examples of what Flow Launcher would look like with the plugin you’re creating. These are just mockups and might not be 100% accurate to the actual appearance of Flow Launcher. However, they should give you a good idea of what to expect. Here’s an example with the plugin we just created:

mp

Decorators

You might have never seen this syntax in JavaScript/TypeScript before, putting things prefixed with @ before something. These are called decorators. Essentially, they are just functions that modify or decorate the behavior of classes, class methods, or class fields. In this case, the @FlowPlugin.Class decorator is used to tell Flow Launcher that this is the main plugin class we want to run. This library heavily relies on decorators to make the plugin development process easier and simpler.