Typo3 中未调用 RequireJS 回调答案

【问题标题】：RequireJS callback not called in Typo3Typo3 中未调用 RequireJS 回调
【发布时间】：2021-03-30 14:18:33
【问题描述】：

我们正在为一个更大的大学网站开发 Typo3 扩展，并且正在努力使用 RequireJS 获取自定义 JavaScript 代码以在前端运行。当我们尝试使用 RequireJS 加载我们的依赖项时，我们甚至无法获得一个简单的示例。

我们尝试遵循官方文档https://docs.typo3.org/m/typo3/reference-coreapi/9.5/en-us/ApiOverview/JavaScript/RequireJS/Index.html，但我们无法调用Test.say()（见下文）。

我们的项目结构如下：

- Classes
  - (all our PHP code)
- Configuration
  - (AjaxRoutes, FlexForms and TCA) 
- Ressources
  - Private
    - Templates
      - Modulelist
        - List.html
  - Public
    - JavaScript
      - ListFilter.js
- composer.json
- ext_emconf.php
- ext_localconf.php
- ext_tables.sql

列表.html：

<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers">
<!-- this is just some table filled by a controller -->
<table border="1" cellspacing="1" cellpadding="5">
    <tr>
        <td>Modulname</td>
        <td>OU Name</td>
        <td>ECTS</td>
    </tr>
    <f:for each="{modules}" as="module">
        <tr>
            <td align="top">{module.name}</td>
            <td align="top">
                <f:format.crop maxCharacters="100">{module.offeredBy.name}</f:format.crop>
            </td>
            <td align="top">{module.ects}</td>
        </tr>
    </f:for>
</table>

<!-- our extension is named DemoExtension -->
<f:be.pageRenderer
    includeRequireJsModules="{
        0:'TYPO3/CMS/DemoExtension/ListFilter'
    }"
/>
</html>

ListFilter.js：

console.log("ListFilter.js loaded");
define(['jquery', 'TYPO3/CMS/Core/DocumentService'], function($, DS) {
    console.log("List.html inside define");
    var Test = {
        message: "test"
    };

    Test.say = function() {
        alert(Test.message);
    };

    $(document).ready(function() {
        console.log("List.html inside define, jQ callback");
        Test.say();
    });

    DS.ready().then(() => {
        console.log("List.html inside define, DS callback");
        Test.say();
    });

    return Test;
});

但是，在加载相应页面时，控制台只打印了下面一行：

ListFilter.js loaded

我们用谷歌搜索了很多，但无法正常工作。我们缺少什么？

【问题讨论】：

标签： javascript php typo3 requirejs typo3-extensions

【解决方案1】：

TYPO3 默认不会在前端加载任何 Javascript。

您的前端呈现的内容由您的模板（排版/流体）定义

您可能正在寻找 page.includeJS 或类似的配置。但是最好的方法可以非常广泛地取决于您如何呈现您的前端以及您在您的网站中拥有哪些其他扩展，例如 vhs/flux

请参阅此核心文档以获取 PAGE OBJECT 的参考 https://docs.typo3.org/m/typo3/reference-typoscript/master/en-us/Setup/Page/Index.html#page

【讨论】：

【解决方案2】：

你真的加载了 RequireJS 吗？

TYPO3 中 PageRenderer 中的特殊 RequireJS 支持仅适用于后端。

【讨论】：

这可能是问题所在。不，我们没有那样做。我们究竟如何为前端加载 RequireJS？此外，我们可能不会从我们自己的网络服务器之外的其他网络服务器请求，因此加载而不是从我们自己的typo3服务器加载它不是一种选择。
有很多可能性。这是一篇文章pagemachine.de/blog/typo3-frontend-requirejs