How to pass custom configuration from plugins.js to a Strapi plugin component

Questions and Answers Strapi Backend
1
System Information
  • Strapi Version v4.9.0:

Title: How to pass custom configuration from plugins.js to a Strapi plugin file

I’m trying to customize a Strapi plugin that allows users to configure the plugin’s behavior through the config\plugins.js file.

Here’s an overview of my current setup:

Folder structure:

luaCopy code

src
|-- plugins
    |-- strapi-plugin-editorjs
        |-- admin
            |-- src
                |-- components
                |-- config
                    |-- customTools.js
                |-- pluginId.js
                |-- index.js
config
|-- plugins.js

config\plugins.js:

javascriptCopy code

editorjs: {
  enabled: true,
  resolve: "./src/plugins/strapi-plugin-editorjs",
  config: {
    customTools: { superscript: true, otherProperties: true, paragraph: false },
  },
},

src\plugins\strapi-plugin-editorjs\admin\src\index.js:

javascriptCopy code

import pluginPkg from "../../package.json";
import Wysiwyg from "./components/Wysiwyg";
import pluginId from "./pluginId";

export default {
  register(app) {
    const pluginDescription = pluginPkg.strapi.description || pluginPkg.description;
    app.registerComponent(pluginId, "wysiwyg", Wysiwyg);
    app.registerField(pluginId, "wysiwyg", Wysiwyg);
  },
};

src\plugins\strapi-plugin-editorjs\admin\src\components\Wysiwyg\index.js:

javascriptCopy code

// I want to access customTools from config\plugins.js here
const Wysiwyg = ({
  name,
  className,
  error,
  description,
  intlLabel,
  required,
  onChange,
  style,
  value,
  disabled,
}) => {
  const { formatMessage } = useIntl();
...

Any help or guidance would be appreciated.

2

Hi,

Create a controller under server/src/

write this inside;

module.exports = {
configController: async (ctx) => {
const config = strapi.config.get(“plugin.location-field”);
ctx.send(config);
},
};

and update routes/index.js like this;

// custom route to expose the values in config/plugins.js to the front end
module.exports = {
“admin”: {
type: “admin”,
routes: [
{
method: “GET”,
path: “/config”,
handler: “plugin::location-field.location-field.configController”,
config: {
policies: [“admin::isAuthenticatedAdmin”],
},
},
],
},
};

then fetch it from components.

for more information read codes of the example