futurerockstars/webloader

Tool for loading or deploying CSS and JS files into web pages

dev-master 2024-05-31 11:02 UTC

Requires

• php: >=7.4.0 <8.0.0
• latte/latte: ^2.7.4
• nette/application: ^3.1.11
• nette/caching: ^3.1.4
• nette/di: ^3.1.2
• nette/finder: ^2.6.0|^3.0.0
• nette/http: ^3.2.2
• nette/safe-stream: ^2.5.1
• nette/utils: ^3.1.6|^4.0.0
• tedivm/jshrink: ^1.6.8
• tracy/tracy: ^2.6.0
• tubalmartin/cssmin: ^4.1.0

Requires (Dev)

• brianium/paratest: ^6.10
• mockery/mockery: ^1.6.2
• nette/bootstrap: ^3.1.4
• nette/robot-loader: ^3.1.0
• orisai/coding-standard: ^3.7
• phpstan/extension-installer: ^1.3
• phpstan/phpstan: ^1.10
• phpstan/phpstan-deprecation-rules: ^1.1
• phpstan/phpstan-nette: ^1.2
• phpstan/phpstan-phpunit: ^1.3
• phpstan/phpstan-strict-rules: ^1.5
• phpunit/phpunit: ^9.5.0
• scssphp/scssphp: ^1.11.0
• staabm/annotate-pull-request-from-checkstyle: ^1.8
• wikimedia/less.php: ^4.1.0

Suggests

• scssphp/scssphp: SCSS compiler written in PHP.
• wikimedia/less.php: LESS compiler written in PHP.

MIT

• Jan Marek

• assets
• javascript
• css
• nette
• webloader

README

Component for CSS and JS files loading

Author: Jan Marek Licence: MIT

Example

Control factory in Nette presenter:

<?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;
}

Template:

{control css}

Example with Nette Framework extension used

Configuration in app/config/config.neon:

extensions:
	webloader: WebLoader\Nette\Extension

services:
	wlCssFilter: WebLoader\Filter\CssUrlsFilter(%wwwDir%)
	lessFilter: WebLoader\Filter\LessFilter
	jwlCssMinFilter: WebLoader\Filter\CssMinFilter
	jsMinFilter: WebLoader\Filter\JsMinFilter

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:
				- http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js
				- http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js
			files:
				- %appDir%/../libs/nette/nette/client-side/netteForms.js
				- web.js

Template:

{control css}
{control js}