如何在Shopware 6后台插件中使用配置及在Vue/Twig中调用？

1. 如何在Shopware 6后台插件中使用插件配置？ #

步骤1：创建配置定义文件 #

在插件的src/Resources/config目录下新建config.xml，定义配置字段：

<?xml version="1.0" encoding="UTF-8"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
        xsi:noNamespaceSchemaLocation="https://raw.githubusercontent.com/shopware/platform/trunk/src/Core/System/SystemConfig/Schema/config.xsd">
    <card>
        <title>我的插件配置</title>
        <input-field type="text">
            <name>inputFieldName</name>
            <label>示例输入字段</label>
            <placeholder>请输入内容</placeholder>
            <help-text>这是一个示例配置字段</help-text>
        </input-field>
        <boolean-field>
            <name>enableFeature</name>
            <label>启用功能</label>
        </boolean-field>
    </card>
</config>

步骤2：注册配置（Shopware 6.4+可跳过） #

Shopware 6.4及以上版本会自动读取config.xml，低版本需在插件主类中手动注册并设置默认值：

<?php declare(strict_types=1);

namespace MyPlugin;

use Shopware\Core\Framework\Plugin;
use Shopware\Core\Framework\Plugin\Context\PluginActivationContext;
use Shopware\Core\System\SystemConfig\SystemConfigService;

class MyPlugin extends Plugin
{
    public function activate(PluginActivationContext $context): void
    {
        parent::activate($context);
        $systemConfig = $this->container->get(SystemConfigService::class);
        $systemConfig->set('MyPlugin.config.inputFieldName', '默认值');
    }
}

步骤3：后台配置与保存 #

激活插件后，进入后台「设置」→「系统」→「插件配置」，找到你的插件即可编辑并保存配置。

步骤4：PHP代码中读取配置 #

通过注入SystemConfigService读取配置，支持全局/多店铺场景：

<?php
use Shopware\Core\System\SystemConfig\SystemConfigService;

class MyController extends AbstractController
{
    private SystemConfigService $systemConfigService;

    public function __construct(SystemConfigService $systemConfigService)
    {
        $this->systemConfigService = $systemConfigService;
    }

    public function myAction(): Response
    {
        // 全局配置
        $globalValue = $this->systemConfigService->get('MyPlugin.config.inputFieldName');
        // 指定店铺配置（传入salesChannelId）
        $shopValue = $this->systemConfigService->get('MyPlugin.config.inputFieldName', $salesChannelId);
    }
}

2. 在Vue组件或Twig模板中调用插件配置 #

先排查{{ config('pluginName.config.inputFieldName') }}不生效的原因 #

• 确认插件名称是正确的技术名称（即插件主类的命名空间短名，如MyPlugin，不是后台显示的友好名称）
• 确认config.xml中字段名称拼写正确，且已在后台保存过配置值
• 多店铺场景下，需确保当前店铺的配置已设置，或传入对应店铺ID

在Twig模板中调用 #

方法1：直接使用config函数

{# 全局配置 #}
{{ config('MyPlugin.config.inputFieldName') }}

{# 指定店铺配置 #}
{{ config('MyPlugin.config.inputFieldName', salesChannel.id) }}

若仍不生效，可在控制器中传递配置值到模板：

public function templateAction(ResponseFactory $responseFactory, SystemConfigService $systemConfigService): Response
{
    $configValue = $systemConfigService->get('MyPlugin.config.inputFieldName');
    return $responseFactory->createTemplateResponse('@MyPlugin/storefront/page/my-page.html.twig', [
        'pluginConfig' => $configValue
    ]);
}

模板中调用：

{{ pluginConfig }}

方法2：通过全局变量shopware.config

Storefront会自动注入插件配置到全局变量，可直接调用：

{{ shopware.config['MyPlugin.config.inputFieldName'] }}

在后台Vue组件中调用 #

通过systemConfigService异步获取配置：

import { Component, Mixins } from 'vue-property-decorator';
import { SystemConfig } from 'src/core/service/system-config.service';

@Component
export default class MyPluginComponent extends Mixins() {
    systemConfigService = SystemConfig;
    myConfigValue = '';

    async created() {
        // 全局配置
        this.myConfigValue = await this.systemConfigService.getValue('MyPlugin.config.inputFieldName');
        // 指定店铺配置
        // this.myConfigValue = await this.systemConfigService.getValue('MyPlugin.config.inputFieldName', this.currentSalesChannelId);
    }
}

模板中直接使用：

<template>
    <div>配置值：{{ myConfigValue }}</div>
</template>

内容的提问来源于stack exchange，提问作者M.E.