Attention
TYPO3 v12 has reached end-of-life as of April 30th 2026 and is no longer being maintained. Use the version switcher on the top left of this page to select documentation for a supported version of TYPO3.
Need more time before upgrading? You can purchase Extended Long Term Support (ELTS) for TYPO3 v12 here: TYPO3 ELTS.
Use RequireJS in your own extension
Attention
Deprecated since version 12.0
The RequireJS project has been discontinued and was therefore replaced by native ECMAScript v6/v11 modules in TYPO3 v12.0. The infrastructure for configuration and loading of RequireJS modules is deprecated with v12.0 and will be removed in TYPO3 v13. See RequireJS to ES6 migration.
To be able to use RequireJS at all, some prerequisites must be fulfilled:
- Your extension must have a
Resources/directory. That directory is used for autoloading the modules stored in your extension.Public/ Java Script - Each module has a namespace and a module name. The namespace is
TYPO3/, <EXTKEY> is your extension key in UpperCamelCase, e.g. foo_bar = FooBarCMS/<EXTKEY> - The namespace maps automatic to your
Resources/directoryPublic/ Java Script - The filename is the modulename +
.js
Think about what's the purpose of the module. You can only write one module per file (anything else is bad practice anyway)
A complete example: TYPO3/ is resided in EXT:
Every AMD (Asynchronous Module Definition) is wrapped in the same construct:
define([], function() {
// your module logic here
});
This is the "container" of the module. It holds the module logic and takes care of dependencies.
TYPO3 defines in its own modules an object to hold the module logic in properties and methods. The object has the same name as the module. In our case "MyMagicModule":
define([], function() {
var MyMagicModule = {
foo: 'bar'
};
MyMagicModule.init = function() {
// do init stuff
};
// To let the module be a dependency of another module, we return our object
return MyMagicModule;
});