kaystrobach / typo3.dyncss Goto Github PK

View Code? Open in Web Editor NEW

9.0 4.0 27.0 259 KB

Dyncss base extension - Donate if you like it http://donate.kay-strobach.de/

Home Page: http://forge.typo3.org/projects/extension-dyncss

License: GNU General Public License v2.0

PHP 100.00%

typo3.dyncss's Introduction

Less in general

The parser libs may ship dedicated information based on the language you want to use.

Frontend

Example TYPOScript:

page.includeCSS.testLess = EXT:dyncss_test/Resources/Public/Stylesheets/Example.less

Example Overrides (dynamic color settings, dynamic image overrides):

plugin.tx_dyncss {
	register = LOAD_REGISTER
	register {
		inputColor1.cObject = TEXT
		inputColor1.cObject {
			value = {$lessColorScheme}
			split {
				token.char = 124
				returnKey = 0
			}
		}
		inputColor2 < .inputColor1
		inputColor2.cObject.split.returnKey = 1
	}
	overrides {
		inputColor1 = TEXT
		inputColor1 {
			data = register:inputColor1
		}
		inputColor2 = TEXT
		inputColor2 {
			data = register:inputColor2
		}
		logo = IMG_RESOURCE
		logo {
			stdWrap.wrap = url("|")
			file = GIFBUILDER
			file {
				XY = [20.w],[20.h]
				20 = IMAGE
				20.file = GIFBUILDER
				20.file {
					XY = 128,22
					backColor.data = register:inputColor1
				}
				20.mask = EXT:example/css/colors/less/images/logo_sw.png
			}
		}
	}
	registerReset = RESTORE_REGISTER
}

Example less file:

	@linkColor: blue;
	@logo: url(someWeirdUrl);

	a {
		color: @linkColor;
	}

	h1 {
		a {
			color: lighten(@linkColor, 20%);
		}
	}
	#logo {
		background-image:@logo
	}

Backend: Include in backend.php

To see how it works, please take a look into dyncss_test.

Caching

In production mode, CSS is only re-rendered if the topmost less or sass file, which is directly included by typoscript, is altered.
In development mode, also changes in files that are imported inside a less or sass file trigger a new rendering.
Development mode is triggered either by TYPO3 application context "Development" or by the preset "Development" in the install tool. Additionally rerendering will happen if you change TS values, which are used in the less files.

Additionally we add a new clear cache button to just clear the dyncss cache.

Source maps

If the compiling library supports source maps, you can enable that feature by enabling the debug mode of dyncss in the extensionmanager settings.

Normally the source maps are appended to the generated css files, to avoid confusion.

IMPORTANT

You need to disable css concatenation to get the sourcemaps working.

This can be done with the following TS based on your environment:

themes.configuration.css.concatenate = 0
page.config.concatenateCss = 0

typo3.dyncss's People

Contributors

Stargazers

Watchers

typo3.dyncss's Issues

Relative URL

Hi,

Somehow I do not get what happens here:

I use dyncss_scss. The original scss file specifies the following relative url:

background-image: url(../../Public/Images/header_bg.png);

In the generated css, I get the following path:

url(../../../../typo3conf/ext/webe_template/Resources/Private/scss/../../Public/Images/header_bg.png)

That's strange, because in the header the css is linked this way:

The rewritten url goes up 4 path levels.

Obviously this is happening here:

// anything inside TYPO3 has to be adjusted
return '../../../../' . dirname($this->removePrefixFromString(PATH_site, $this->inputFilename)) . '/' . $url;

But why? The generated css is taken from typo3temp/DynCss, thus the "root" is 2 levels up. Why is a relative path specified 4 levels up? "../../typo3conf/..." should be correct... but "../../../../typo3conf..." is not.

Adding Minifier into dyncss after parsing the css

this script should look pretty good.

https://github.com/matthiasmullie/minify

Typo3 8.x

Hi Kay,

very nice extension, thanks a lot.
Will there be an adaption for Typo3 Version 8 in near future? Maybe there are only a few adjustments to do?

Nice greetings, Marcel

Errors in Frontend and Backend

in Install-Tool I get this error after deleting the cache:

"Load extension configuration
The system detected a fatal error during script execution and redirected to this module. Your loaded extensions are now checked for possible problems. After incompatible extensions are unloaded, you can restart the initial action to proceed your request.
Detected Fatal Error
Class 'tx_DynCss_Configuration_BeRegistry' not found in /serverdata/project/typo3conf/ext/dyncss_less/ext_localconf.php on line 3

Incompatible extension found!
The following extensions are not compatible. Please uninstall them and try again. "

In Frontend and Backend I get this error:
"Fatal error: Class 'tx_DynCss_Configuration_BeRegistry' not found in /serverdata/project/typo3conf/ext/dyncss_less/ext_localconf.php on line 3 Call Stack: 0.0013 124932 1. {main}() /var/www/typo3_src/typo3/index.php:0 0.0014 125356 2. require('/var/www/typo3_src/typo3/init.php') /var/www/typo3_src/typo3/index.php:21 3.3527 1122412 3. TYPO3\CMS\Core\Core\Bootstrap->loadTypo3LoadedExtAndExtLocalconf() /var/www/typo3_src/typo3/init.php:49 3.3527 1122428 4. TYPO3\CMS\Core\Core\Bootstrap->loadAdditionalConfigurationFromExtensions() /var/www/typo3_src/typo3/sysext/core/Classes/Core/Bootstrap.php:334 3.3527 1122500 5. TYPO3\CMS\Core\Utility\ExtensionManagementUtility::loadExtLocalconf() /var/www/typo3_src/typo3/sysext/core/Classes/Core/Bootstrap.php:647 3.3531 1122736 6. TYPO3\CMS\Core\Utility\ExtensionManagementUtility::loadSingleExtLocalconfFiles() /var/www/typo3_src/typo3/sysext/core/Classes/Utility/ExtensionManagementUtility.php:1505 3.4078 1298584 7. require('/serverdata/project/typo3conf/ext/dyncss_less/ext_localconf.php') /var/www/typo3_src/typo3/sysext/core/Classes/Utility/ExtensionManagementUtility.php:1529 "

test

Please update TER

I just wanted to know if there are any plans on updating the TER version of this extension any time soon.

Parsing often fails (404 of CSS file)

We're having trouble with dyncss (_phpsass … don't know whether it's due to dyncss or dyncss_phpsass, sorry if I'm posting at the wrong place).

We have an SCSS file that imports a few other SCSS files. And every now and then parsing fails and the CSS file is referenced, but not generated.

We have no clue how to troubleshoot this, because there is nothing in the logs so far. Today we got it working by removing an commented out @import. Funny thing: after changing it back, it still worked.

Could it be a cache problem with one particular imported file, when this happens?

Situation before, resulting in not generating a file:

@import "0_helpers";
@import "10_general";
/* @import "20_main_menu"; */
@import "20_menu";
@import "30_news";
@import "98_content";

Working version, only removed the 20_main_menu:

@import "0_helpers";
@import "10_general";
@import "20_menu";
@import "30_news";
@import "98_content";

And then, it finally worked with version 1 ("before") again. Only thing changed might be a cached file for _20_main_menu.scss.

Do you have an idea what it could be, and/or how to solve this forever? It's occurring in each project we're working on at least once.

Error with php 7.2

If i try to install dyncss i became the following error-message in the backend:

PHP Warning: Use of undefined constant TYPO3_cliMode - assumed 'TYPO3_cliMode' (this will throw an Error in a future version of PHP) in /var/www/vhosts/dev05.master-ble-prered.ble.de/htdocs/typo3conf/ext/dyncss/Classes/Service/DyncssService.php line 47

i use php 7.2

Manual DynCSS cache clearing not triggered

First of all nice work so far, big thanks for that!

The manual DynCSS cache clearing button does not work for me in a TYPO3 6.2 installation. I did some debugging and the 'clearCachePostProc'-Function of the hook is never called.

Comparing the URLs of the cache clearing buttons, the one from DynCSS is slightly different from the others.

URL of "System Cache" button
...typo3/tce_db.php?vC=8f8e1dca89&cacheCmd=system...

URL of "DynCSS Cache" button
...typo3/mod.php?M=tce_db&moduleToken=0c5856978e7d64014ffaf2540cd6653c817ba5a4&vC=...

After telling the "DynCSS Cache" button to also directly use tce_db.php cache clearing works perfectly.

I changed line 34 of the file dyncss/Classes/Hooks/Backend/Toolbar/ClearCacheActionsHook.php

from ...
'href' => BackendUtility::getModuleUrl('tce_db') . '&vC=' . $this->getBackendUser()->veriCode() . '&cacheCmd=dyncss&ajaxCall=1' . BackendUtility::getUrlToken('tceAction'),

to ...
'href' => 'tce_db.php?vC=' . $this->getBackendUser()->veriCode() . '&cacheCmd=dyncss&ajaxCall=1' . BackendUtility::getUrlToken('tceAction'),

However, it could be that has some drawbacks for TYPO3 7.x, because mod.php seems to be used there by default.

Btw I also wrote an issue on forge.typo3.org. Is Github generally the preferred issue tracker for this project?

test2

Idea: "Clear Page Cache" at "Clear DynCSS cache"

Its Only one Line in the script.

KayStrobach\Dyncss\Hooks\T3libTcemainHook @ line 36
$pObj->clear_cacheCmd("pages");

scss compressed file as http/2 push preload-link

Hello,

i am not sure, if this extension is responsible to compressed files in hook-depedence of the t3sbootstrap-extension (i think so)

I want to change to this (example): <link rel="preload" href="/typo3temp/DynCss/bootstrap.scss-123456789.css?1539284572" as="style">

where is the place to change it realy, i think it is the TslibFeContentPostProcAllHook.php

//Neu, Test, Heiko 14.10.2018 rel=preload as=style
$linkElements = $xPath->query("//link[@rel='preload' @as='style']");

but my sceduler didnt works for recache ...

compatibility with TYPO3 version 7.x ???

installing in a 7.0.2 Version the EM crashes
it is the missing of namespaces, wit the compatibility6 it seems to work

Context-sensitive file cache not working in TYPO3 8 LTS

Under TYPO3 8 LTS and Development-context the parser should generate a new file if include-files where changed. This worked in TYPO3 7 LTS (maybe a unknown effect because i think the commit https://github.com/kaystrobach/TYPO3.dyncss/pull/39 breaks this behaviour on LTS 7 too).

Currently I added an additional Development-Mode check in Classes/Parser/AbstractParser.php:289 to disable caching.
if (@filemtime($outputFilename) < @filemtime($inputFilename) || $this->_checkIfCompileNeeded($inputFilename) || ApplicationContext::isDevelopmentModeActive()) {

Another problem with inline SVGs

Fix for this problem in branch issue-47
Please merge it.

dyncss breaks extension configuration in TYPO3 9.5

Since an update from TYPO3 7.6 to 9.5 the dyncss-extension breaks the extension configuration, so configuration of any extension can be done only by deactivating dyncss.

I get an ajax-error, here is the first part of the error shown:

Error
Call to a member function setAndSaveSessionData() on null

in /html/typo3_update/typo3_src-9.5.15/typo3/sysext/core/Classes/Messaging/FlashMessageQueue.php line 151
* @param FlashMessage[] $flashMessages
*/
protected function storeFlashMessagesInSession(array $flashMessages = null)
{
$this->getUserByContext()->setAndSaveSessionData($this->identifier, $flashMessages);

Uncaught TYPO3 Exception while unlink

Following unlink needs a '@' or a file_exists() before using unlink:
https://github.com/kaystrobach/TYPO3.dyncss/blob/master/Classes/Parser/AbstractParser.php#L215
#1: PHP Warning: unlink(..../typo3temp/DynCss/import.less-8a40314c-05b3c2ef-9d867cf6.less): No such file or directory in ..../typo3conf/ext/dyncss/Classes/Parser/AbstractParser.php line 215 (More information)

Dyncss-Cache Issue

Data url is extended with relative path

Hi there,
i got dyncss 0.7.4 and dyncss scss 0.7.1. Giving data-url to url() extends them with relative path.

url('data:image/svg+xml;base64,PD94bWwgdmV]...[');
converts to
url('../../../../fileadmin/templates/default/css/data:image/svg+xml;base64,PD94bWwgdmV]...[');

Any solution for it?
Bye
Patrick

fix path issues

/typo3temp/Cache/Data/fonts/glyphicons-halflings-regular.woff > should be relocated during

project/typo3conf/ext/dyncss/Classes/Parser/AbstractParser.php:64 -> regex is probably wrong

Different parser can't be determined in extension configuration view.

In TYPO3 9.5 the file handles can't be determined, because the extension configuration view now runs in install tool context.
This needs to be fixed.

build via commandline (configured by yaml file)

Add possibility of rte dynamic css

needs some thougths -> options define name in ts -> link in page module, needs to respect templates as well -> relativ complex :D

AbstractParser compile condition

In AbstractParser->compileFile müssen die Conditions geprüft werden, da sonst u.U. die Less-Dateien immer kompiliert werden.

add clear cache button for the parsed files ...

Implement support for source map

scssphp has build in support for source maps. Would be cool if the extension could make use of that feature.

Error with Typo3 7.0

I know this is a bit out of the use case, because I use DynCSS with Typo3 7.0.

The good news is: It works! :-)

The bad news is: I get an error in the backend:

TYPO3\CMS\Core\Utility\GeneralUtility::callUserFunction
|No class named KayStrobach\Dyncss\Hooks\|

But it still generates CSS out of my less-sources! There is now visible error in the frontend.

So I still use DynCSS and ignore this error!

Exception on $activePreset = null in ApplicationContext

If i switch my installation to TYPO3_CONTEXT=Testing I run into an Exception caused by isDevelopPresetActive() in KayStrobach\Dyncss\Utilities\ApplicationContext

There is no $activePreset available which is why $activePreset->getName() will trigger an exception.

TYPO3.dyncss/Classes/Utilities/ApplicationContext.php

Line 76 in 6f947ab

if ($activePreset->getName() === 'Development') {

Will upload a patch

Filepaths in compiled CSS

dyncss 0.7.4
dyncss_scss 0.7.1

I have the following path in my style.scss (typo3conf/ext/theme_gugler_bootstrap_ipp/Resources/Private/Dyncss/Library/style.scss):

url(../../../Public/Images/m_menu.svg)

The image is located in:
typo3conf/ext/theme_gugler_bootstrap_ipp/Resources/Public/Images/m_menu.svg

The resulting path in the compiled css file looks like this: ?!

../../../../typo3conf/ext/theme_gugler_bootstrap_ipp/Resources/Private/Dyncss/Library/../../../../typo3conf/ext/theme_gugler_bootstrap_ipp/Resources/Private/Dyncss/Library/../../../../typo3conf/ext/theme_gugler_bootstrap_ipp/Resources/Private/Dyncss/Library/../../../Public/Images/m_menu.svg

Large SCSS Files leads to Error 500 in FE

When i try to compile very large SCSS Files i get a error 500 in the Frontend. The problem is that i cant debug it. @kaystrobach told me the install tool settings to get details of the problem, but i only get this from the apache log

FastCGI: comm with server "/Applications/MAMP/fcgi-bin/php7.0.15.fcgi" aborted: idle timeout (30 sec)

I also recognized a php task on my lokal machine that cause 100% load when the FE is called the first time. This task is still running when i get the error 500. After some time it stops without any error in the php log.

As soon as i use a smaller SCSS file everything works fine.

Warnings because of TYPO3_cliMode check

This line throws some warnings in PHP 7.2, would it be possible to extend the code to something like below?

TYPO3.dyncss/Classes/Service/DyncssService.php

Line 47 in 762659e

} elseif (TYPO3_MODE === 'BE' && !TYPO3_cliMode) {

} elseif (TYPO3_MODE === 'BE' && (!defined('TYPO3_cliMode') || !TYPO3_cliMode)) {

Possibility of creating namespaces

We are currently working on an aggregator web site. The problem is, that we will have som remote css that can override our selector. Best would be if we can set a namespace to avoid conflicts,

Is there a possibility to realize that?

PHP Warning: Use of undefined constant TYPO3_cliMode

- assumed 'TYPO3_cliMode' (this will throw an Error in a future version of PHP) in /var/www/html/web/typo3conf/ext/dyncss/Classes/Service/DyncssService.php line 47

should probably we changed to

!defined('TYPO3_cliMode')

packagist ...

ability to add @import statements for resources(mixins) from other extensions

Use Case:

theme_bootstrap4 ships a fully fledged and well configurable scss/css stack for bootstrap.

In our own extension we add some additional scss/css. Now we would like to make use of the bootstrap mixins inside our scss.

@import "../../../../theme_bootstrap4/Resources/Public/Contrib/Bootstrap/scss/mixins";

This just does not work currently.

If 'EXT:theme_bootstrap4' resolving would work this would be awesome, other than that relative paths like above would be fine as well.

[critical] full server path in URL

hi... i'm using dyncss 0.7.3 and dyncss.less 0.7.2

in my css i have relative paths... the new path is build relativly correctly, but in the new url in the dynamic css there is the full server path inside...
In the less file in: http://domain.tld/home/fileadmin/template/css/style.less
i have the relative path: ../images/file.jpg
I would expect: http://domain.tld/fileadmin/template/images/file.jpg
but i get: http://domain.tld/home/www/html/fileadmin/template/images/file.jpg
The home/www/html/ is the server path to my docroot ??? what is missing im my installation ???

No class named KayStrobach\Dyncss\ExtMgm\Statefield

I got this error when opening the Extension-Setup. Renaming the file "StateField.php" into "Statefield.php" solved the problem.

Caching issue in development environment

Hi Kay

What a awesome extension. Nice work.

Our company implemented your extension in some websites. During implementation and testing we found an issue in the caching mechanism.

It depends on following environment: Typo3 7.6, dyncss 0.7.9, dyncss_scss (1.0.5), Environment mode: Development

Everything is ok, when the whole Typo3 page is cached. But if we use a uncached Extbase plugin or a uncached Typoscript object (COA_INT, USER_INT) the SASS file gets compiled on each page load. Next step i took a look in the code of the dyncss extension and saw a logical problem in the evaluation if a file has been modified. Please, correct me if i'm wrong.

it affects following file: Classes\Parser\AbstractParser.php

On line 260 you check, if the modification time of the prepared file is younger than the modification time of the input file. If so, the SASS file gets compiled. But after the compilation is done, you delete (unlink) the prepared file. On the next page load the same condition returns TRUE, because the prepared file does not exists (@filemtime() returns FALSE). I think the condition should check if the output file is younger than the input file.

With this modification on line 260 it will work:
if(@filemtime($outputFilename) < @filemtime($inputFilename) || $this->_checkIfCompileNeeded($inputFilename)) {

Do i misundestand something or is this a bug? Thank you for your feedback.

Best regads Michael