如何将公共资源包含在 Typo3 扩展扩展中

Question

我正在构建一个扩展，该扩展创建一个后端模块，使be_users能够调整图像大小。我正在尝试使用 pageRenderer 添加/包含 css 和 javascript 文件，但这些文件从未包含在内，我只能在使用样式标签直接将其添加到流体模板中并包含带有脚本标签的 javascript 文件时应用 css。

我在控制器中尝试了这样的事情

protected $pageRenderer;

....

    $this->pageRenderer = TYPO3CMSCoreUtilityGeneralUtility::makeInstance('TYPO3\CMS\Core\Page\PageRenderer');
    $this->pageRenderer->addCssFile('/typo3conf/ext/extKey/Resources/Public/css/styles.css');
    $this->pageRenderer->loadJquery();

还尝试使用视图助手

namespace VendorExtKeyViewHelpers;
class AddJsFileViewHelper extends TYPO3CMSFluidViewHelpersBeAbstractBackendViewHelper {
    public function render() {
        $doc = $this->getDocInstance();
        $pageRenderer = $doc->getPageRenderer();
        $pageRenderer->loadJquery();
    }
}

在我的诱惑中

{namespace pager=VendorExtKeyViewHelpers}
<f:layout name="Default" />
<f:section name="main">
    <pager:addJsFile />

。

还是一无所有

Answer 1

我不确定您如何为后端定义模板，但似乎这通常发生在后端容器视图助手中，该助手已经具有该功能：

<f:be.container
  addCssFile="{f:uri.resource(path:'css/style.css')}"
  addJsFile="{f:uri.resource(path:'js/scripts.js')}">
  [your templates content]
</f:be.container>

Answer 2

在 TYPO3 7.6.X 中，它必须像下面这样

<f:be.container
     includeCssFiles="{style:'{f:uri.resource(path:'css/style.css')}'}"
     includeJsFiles="{script:'{f:uri.resource(path:'js/script.js')}'}"
    >
<!-- Template Code -->
</f:be.container>

由于includeCssFiles和includeJsFiles需要传递数组，因此我们 可以包含任意数量的 JS 和 CSS。

Answer 3

我认为问题是我的 ViewHelper 需要渲染儿童页面和开始/结束页面

当前的实现是这样的

视图助手

namespace VendorExtKeyViewHelpers;
class AddPublicResourcesViewHelper extends  TYPO3CMSFluidViewHelpersBeAbstractBackendViewHelper {
    public function render() {
        $doc = $this->getDocInstance();
        $pageRenderer = $doc->getPageRenderer();
        $extRelPath = TYPO3CMSCoreUtilityExtensionManagementUtility::extRelPath("ext_key");
        $pageRenderer->addCssFile($extRelPath . "Resources/Public/css/styles.css");
        $pageRenderer->loadJquery();
        $pageRenderer->addJsFile($extRelPath . "Resources/Public/js/app.js");
        $output = $this->renderChildren();
        $output = $doc->startPage("title") . $output;
        $output .= $doc->endPage();
        return $output;
    }
}

模板

{namespace pager=VendorExtKeyViewHelpers}
<f:layout name="Default" />
<f:section name="main">
<pager:addPublicResources />

Pagerender：：loadJjquery正在工作并且可以像这样访问

TYPO3.jQuery(function($) {
});