Running Selectoplasm

By now you should have the Selectoplasm vite plugin installed, and at least one plugin in the .selectoplasm/plugins directory. You can run Selectoplasm without any plugins, but it will not be particularly useful.

Run your project in dev mode, using npm run dev or the equivalent command, and open it in your browser. For the best experience while Selectoplasm is in beta, a Chromium based browser is recommended.

Open your project in your browser, and in addition to your app, you should see an overlay that looks something like the following, though probably arranged differently, and hopefully with at least one plugin and stylesheet:

The island at the bottom there explains Selectoplasm's core workflow:

Plugins -> Stylesheets -> Components.

Use plugins to generate stylesheets, and then use those stylesheets to build components.

You won't interact with or modify the stylesheets directly, but you can reorder, enable/disable, and view them. In a sense, the stylesheet viewer will be your specific workflow's documentation and reference.

The two things you'll be interacting with the most are the Plugin Manager (which we'll discuss a bit later) and the Component Builder, which you can't see yet because we haven't created any components.

Let's do that next!