Лучшая практика для использования / добавления JavaScript и CSS в TYPO3-Extension - PullRequest
Новая
       50

Лучшая практика для использования / добавления JavaScript и CSS в TYPO3-Extension

0 голосов
/ 06 апреля 2020

Лучшая практика?

Дано: Я создаю расширение для веб-сайта TYPO3, для которого требуется javaScript -Framework-Plugin (jQuery -Datepicker), некоторые JavaScript -Code (выпадающий список- Пользовательский интерфейс) для шаблона и на странице некоторые специальные JavaScript -Параметр (JSON с DATAS для DataTables).

Вопрос:

Как мне добавить javascript? BestPractice для javaScript -параметра, для специального Javascript -кода и для JavaScript -Framework-Plugin?

  1. через Fluid HeaderAssests (JSON (будет работать?), Специальный код, Framework)
  2. через TypoScript с условием, что Typoscript «page.include JS» ссылается на «page = PAGE» в typoscript Расширения sitepackage (Специальный код, Framework)
  3. через контроллер / Pagarenderer в моем плагине (Специальный код, Framework)
  4. через typoScript в ext_typoscript_setup.typoscript и ext_typoscript_constants.typoscript (JSON, Специальный код, Framework)
  5. через HTML -скрипт-тег в Fluid-Template (JSON, Специальный код, Framework)
  6. через атрибут данных в некоторых специальных тегах? (JSON, Special Code)
  7. ... или есть другие способы ??

В TYPO3 существует Icon-API. Существует что-то похожее на JavaScript oder Stylesheets?

Ответы [ 2 ]

0 голосов
/ 14 апреля 2020

Все, что в основном является библиотекой, такой как jquery или ваша пользовательская JavaScript Я бы порекомендовал page.include JS

# third party
page.includeJS.jquery = EXT:ext/Resources/Public/JavaScript/Contrib/jquery.js
# everything that consumes data add to footer
page.includeJSFooter.dropui = EXT:ext/Resources/Public/JavaScript/dropui.js

Данные, которые могут быть использованы библиотеками, такими как список или некоторые сортировать данные, которые можно структурировать как json объект, я делаю:

в контроллере extbase: 

$values = ['name' => 'Thomas', 'age' => '38'];
$this->view->assign("my_data_json", json_encode($values));

в шаблоне: 

<script type='text/javascript'>
    /*  <f:format.cdata> */
    var my_data = <f:format.raw>{my_data_json}</f:format.raw>;
    /*  </f:format.cdata> */
</script>

Теперь ваша библиотека может взять переменную my_data и делать вещи. Скрипт, который потребляет my_data, должен быть включен после page.includeJSFooter

0 голосов
/ 06 апреля 2020

Для собственного использования вы свободны, в какую сторону go. Если вы публикуете sh ваше расширение для других случаев использования, JS и CSS должны быть конфигурируемыми для загрузки или не для загрузки. Я предпочитаю способ TypoScript, такой как EXT: fluid_styled_content, который предлагает отдельный установочный файл TypoScript, чтобы включить стили необязательно. В настройках TypoScript вы можете использовать все предоставленные возможности для загрузки CSS и JS: 

# CSS
plugin.tx_myextension._CSS_DEFAULT_STYLE { ... }

# JS
page.includeJS.myfile = EXT:myextension/Resources/Public/JavaScript/myfile.js
page.includeJS.myfile.type = text/javascript
...