solarismedia / webloader
将CSS和JS文件加载或部署到网页的工具
v2.5.2
2022-07-04 20:59 UTC
Requires
- nette/nette: ~v3
README
CSS和JS文件加载组件
作者:Jan Marek 许可证:MIT
示例
Nette演示器中控制工厂
<?php protected function createComponentCss() { $files = new WebLoader\FileCollection(WWW_DIR . '/css'); $files->addFiles(array( 'style.css', WWW_DIR . '/colorbox/colorbox.css', )); $files->addWatchFiles(Finder::findFiles('*.css', '*.less')->in(WWW_DIR . '/css')); $compiler = WebLoader\Compiler::createCssCompiler($files, WWW_DIR . '/temp'); $compiler->addFilter(new WebLoader\Filter\VariablesFilter(array('foo' => 'bar'))); $compiler->addFilter(function ($code) { return cssmin::minify($code, "remove-last-semicolon"); }); $control = new WebLoader\Nette\CssLoader($compiler, '/webtemp'); $control->setMedia('screen'); return $control; }
模板
{control css}
使用Nette框架扩展的示例
在app/config/config.neon
中进行配置
extensions: webloader: WebLoader\Nette\Extension services: wlCssFilter: WebLoader\Filter\CssUrlsFilter(%wwwDir%) lessFilter: WebLoader\Filter\LessFilter jwlCssMinFilter: Joseki\Webloader\CssMinFilter webloader: css: default: files: - style.css - {files: ["*.css", "*.less"], from: %appDir%/presenters} # Nette\Utils\Finder support filters: - @jwlCssMinFilter fileFilters: - @lessFilter - @wlCssFilter watchFiles: # only watch modify file - {files: ["*.css", "*.less"], from: css} - {files: ["*.css", "*.less"], in: css} js: default: remoteFiles: - https://ajax.googleapis.ac.cn/ajax/libs/jquery/1.7/jquery.min.js - https://ajax.googleapis.ac.cn/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js files: - %appDir%/../libs/nette/nette/client-side/netteForms.js - web.js
对于Nette的旧版本,您需要在app/bootstrap.php
中注册扩展
$webloaderExtension = new \WebLoader\Nette\Extension(); $webloaderExtension->install($configurator);
在app/presenters/BasePresenter.php
中使用
/** @var \WebLoader\Nette\LoaderFactory @inject */ public $webLoader; /** @return CssLoader */ protected function createComponentCss() { return $this->webLoader->createCssLoader('default'); } /** @return JavaScriptLoader */ protected function createComponentJs() { return $this->webLoader->createJavaScriptLoader('default'); }
模板
{control css} {control js}