BUG: Non-named plugins and options

Question

GrapesJS version

I confirm to use the latest version of GrapesJS

What browser are you using?

all and none, the bug is during the build

Reproducible demo link

unnecessary

Describe the bug

How to reproduce the bug? Use NPM to install GrapesJS to use it in a typescript project. According to the documentation, to set options of an non-named plugin, we have to defined this in init:

plugins: [myPlugin],
pluginsOpts: {
  [myPlugin]: {
     customField: 'customValue'
  }
}

What is the expected behavior? The build of the project works

What is the current behavior? The build failed with this error: A computed property name must be of type 'string', 'number', 'symbol', or 'any'.

FYI We can use a named plugin but this way of doing is mark as 'Deprecated' in favor of the non-named version and can't be used for official plugins which are provided as non-named

Code of Conduct

I agree to follow this project's Code of Conduct

Answers (3)

artf• May 30, 20230 reactions

This seems to be related to https://github.com/microsoft/TypeScript/issues/35945 As a workaround you could do something like this for now:

pluginsOpts: {
  [myPlugin.toString()]: {
     customField: 'customValue'
  }
}

I guess for the TS type safety we would need to introduce some kind of helper for plugins

import grapesjs, { usePlugin } from 'grapesjs';
import somePlugin from 'gjs-plugin';

grapesjs.init({
  // ...
  plugins: [
    // no need for `pluginsOpts`
    usePlugin(somePlugin, { option1: 'A', option2: 'B', ... })
  ]
});

jchautreux• May 30, 20230 reactions

that sounds to be a good idea

artf• May 30, 20230 reactions

Added the helper here (I'll also update the docs with the usage later)

Paid Plugins That Match This Issue

Curated by issue keywords and label relevance to help you ship faster.

View all plugins

Loading paid plugin recommendations...

Browse Plugin Categories

Jump directly to plugin category pages on the marketplace.

Presets Plugins Components Blocks Assets Commands I18n Layers Styles Storages RTE Newsletters Web pages Site builders

Question

GrapesJS version

What browser are you using?

Reproducible demo link

Describe the bug

Code of Conduct

Answers (3)

Related Questions and Answers

BUG: none of the official GrapesJS plugins works with the new index.d.ts

BUG: Layer manager not refreshing on page change

BUG:

BUG: Can't set background:none in mobile version using styles panel

Paid Plugins That Match This Issue

Browse Plugin Categories