ameotoko / contao-encore-bridge
1.0.3
2022-09-17 17:42 UTC
Requires
- php: ^7.4 || ^8.0
- contao/core-bundle: ^4.13 || ^5.0
- symfony/webpack-encore-bundle: ^1.14
Requires (Dev)
- contao/manager-plugin: ^2.0
README
这是一个为 Contao CMS 提供的扩展,它为 Webpack Encore bundle 的 encoreEntryLinkTags()
和 encoreEntryScriptTags()
函数提供了一个包装器,允许开发者在 .html5
模板中使用这些函数。
安装
注意: Webpack Encore Bundle 需要 output_path
配置项。如果您尚未安装 Webpack Encore Bundle,Contao-Encore Bridge 将会自动将其添加到您的应用程序中,因此请确保在安装前在您的 config.yml
文件中设置 output_path
。
# config/config.yml webpack_encore: output_path: '%kernel.project_dir%/public/build'
然后安装 Contao-Encore Bridge
composer require ameotoko/contao-encore-bridge
配置
按照官方文档的描述配置您的 Webpack Encore
用法
假设您已经像这样配置了您的 Webpack 入口点
// webpack.config.js const Encore = require('@symfony/webpack-encore'); Encore .addEntry('app', './frontend/js/app.js') ;
您现在可以在您的 .html5
模板中输出该入口的所有样式表和脚本,例如在 fe_page.html5
中
<!DOCTYPE html> <html lang="<?= $this->language ?>"<?php if ($this->isRTL): ?> dir="rtl"<?php endif; ?>> <head> ... <?= $this->encoreEntryLinkTags('app') ?> </head> <body> ... <?= $this->mootools ?> <?= $this->encoreEntryScriptTags('app') ?> </body> </html>
或者从任何其他模板添加它们,如下所示
<?php $this->extend('ce_gallery'); ?> <?php $this->block('content'); ?> <?php $this->parent(); ?> <?php $GLOBALS['TL_CSS'][] = $this->encoreEntryLinkTags('app'); ?> <?php $GLOBALS['TL_BODY'][] = $this->encoreEntryScriptTags('app'); ?> <?php $this->endblock(); ?>