Webpack Pagekit/VueJS:添加VueJS组件失败

也许你能成为我这一天的救世主

我正在尝试在我的扩展中实现vue组件

我不能包含自定义Vue.js组件。我随后创建了一个组件，该组件应提供一个模式字段，该字段应包含在扩展的设置视图中。这个模式应该在同一个页面上使用多次，内容不同，因此我更喜欢使用自定义组件，而不是在设置视图中反复硬编码（

views/settings.php

）

为了存档，我创建了以下文件：

app/components/template.vue

<template>
<div>Test</div>
</template>

<script>

    module.exports = {

        section: {
            label: 'Template',
            priority: 100
        }
    };

    window.Settings.components['template'] = module.exports;

</script>

我在

index.php

    'events'      => [
        'view.scripts' => function ( $event, $scripts ) {
            $scripts->register( 'template', 'isp:app/bundle/template.js', '~settings' );
        }
    ]

现在我试着让这些东西在视图中工作

$view->script( 'settings', 'isp:app/bundle/settings.js', [ 'vue', 'uikit-form-password', 'editor' ] )
;

<component :is="template"></component>

$view->script（'settings'，'isp:app/bundle/settings.js'，['vue'，'uikit form password'，'editor']）
;

---

但测试字符串未显示

执行此操作时，您正在将组件命名为“模板”：

window.Settings.components['template'] = module.exports;

将其更改为：

window.Settings.components['component'] = module.exports;

---

嗨，crabbly，不幸的是，这仍然不起作用。其他扩展在这里也不使用['components'，如中所示。此组件包含在名称

post meta

中。这是您命名组件的地方，在您的情况下，您尝试使用

，这意味着您的组件名称必须是

组件

。您可以将其更改为其他内容，如“我的组件<代码>”，然后像这样使用它，但您需要像这样声明它<代码>窗口。设置。组件['my-component']=module.exports`

window.Settings.components['component'] = module.exports;