[addon webloader] Extras/webloader

před 4 lety

castamir
Člen | 631
+
+2
-

s tímto jsem se taky setkal – u větších knihoven (jQuery, bs3 apod) se při minifikaci vyskytují nejspíš potlačené chyby, proto mám v aplikaci více komponent z webloaderu – na vlastní skripty, které minifikuji, a na už minifikované velké knihovny mám prostě druhou komponentu, která je jen slučuje.

Mimochodem doporučuju použití Compiler Extension, které je součástí webloaderu. Příklad jednoho takového konfiguráku:

extensions:
  webloader: WebLoader\Nette\Extension

services:
  wlCssFilter: WebLoader\Filter\CssUrlsFilter(%wwwDir%)
  lessFilter: WebLoader\Filter\LessFilter
  cssMin: Joseki\Webloader\CssMinFilter
  jsMin: Joseki\Webloader\JsMinFilter

webloader:
  css:
    default:
      files:
        - octicons.css
        - design.css
        - tables.css
        - forms.css
      filters:
        - @wlCssFilter
        - @cssMin
    libs:
      files:
        - bootstrap.css
  js:
    default:
      files:
        - %libsDir%/composer/nette/forms/src/assets/netteForms.js
        - datepicker-init.js
        - form-formats.js
        - form-selections.js
        - form-navigation.js
        - main.js
      filters:
        - @jsMin
    libs:
      files:
        - jquery/jquery.js
        - jquery/jquery.ui.js
        - jquery/jquery.ui.lang.js
        - bootstrap/bootstrap.js

BasePresenter.php

/** @var \WebLoader\LoaderFactory @inject */
public $webLoader;


/** @return CssLoader */
protected function createComponentCss()
{
    return $this->webLoader->createCssLoader('default');
}



/** @return JavaScriptLoader */
protected function createComponentJs()
{
    return $this->webLoader->createJavaScriptLoader('default');
}



/** @return CssLoader */
protected function createComponentCssLibs()
{
    return $this->webLoader->createCssLoader('libs');
}



/** @return JavaScriptLoader */
protected function createComponentJsLibs()
{
    return $this->webLoader->createJavaScriptLoader('libs');
}

před 4 lety

Tirus91
Generous Backer | 199
+
0
-

@iguana007
Ne, cesta je vážně správně.. pak na to zase mrknu

@castamir
Super, kouknu na to
Zda to dobře chápu, tak libs nikdy neminifikuješ

před 4 lety

castamir
Člen | 631
+
0
-

@Tirus91 přesně tak, jsou to totiž už samé minimalizované knihovny, tak k tomu ani není důvod

před 4 lety

CZechBoY
Člen | 3312
+
0
-

Nevíte jak nastavit jiný práva pro generovaný js/css soubory ve webtempu?
Díky

před 4 lety

akadlec
Člen | 1309
+
0
-

jak jiný práva? to by chtělo upřesnit i OS.

před 4 lety

CZechBoY
Člen | 3312
+
0
-

@akadlec chmod pro nově vytvořené soubory, OS nějaký freebsd tuším.

před 4 lety

jiri.pudil
Člen | 846
+
0
-

před 4 lety

CZechBoY
Člen | 3312
+
0
-

@jiri.pudil no jasný, ale kde to v tom modulu nastavim? Nebo to musim ručně po generování těch souborů?

před 4 lety

Michal Vyšinský
Člen | 614
+
+1
-

@CZechBoY: já mám v bootstrap.php na začátku:

umask(0);

a práva nových souborů (včetně temp/cache) mě netrápí.

před 4 lety

CZechBoY
Člen | 3312
+
0
-

@MichalVyšinský umask(0) dělá co? To jen vrací masku ne?
No já mám problém, že mi webloader vytvoří soubor s právama, který jsou odmítnutý přes apache :(

před 4 lety

Michal Vyšinský
Člen | 614
+
+2
-

@CZechBoY http://php.net/…on.umask.php

umask vrací starou masku, jinak ale také nastaví práva pro nově vytvořené soubory na danou masku & 0777 takže umask(0) nastaví 0777.

před 4 lety

Rypi
Člen | 38
+
0
-

Mohl by mi někdo prosím poradit, jak použít CSSUrlFilter tak, aby předělal url v CSS souborech?
Ideálně pomocí configu v neonu.

css mám třeba v /web/theme/css/abc.css a WebLoader pouziva /webtemp/css.css
obrázky jsou umístěny třeba v /web/theme/img/abc.png, takže v css je url(‚../abc.png‘)

Díky moc

před 4 lety

Rypi
Člen | 38
+
0
-

Dnes jsem na to po debugování kódu webloaderu přišel,
WebLoader\Filter\CssUrlsFilter('web/theme', '/web/theme')

Problém byl v tom, že jsem jako první parametr dával třeba wwwdir, což je ale a nefungovalo.
Snad to ostatním pomůže :)

před 4 lety

zimmi
Člen | 95
+
0
-

Nepotýkali jste se někdo při minifikaci pomocí https://github.com/natxet/CssMin s tím, že se vám pak přestanou načítat font-awesome/glyphicon @font-face? Případně doporučení na nějaký jiný minifier?

Edit: Achjo, to mám nejradši, když něco napíšu, pak se podívám do toho css a zjistím, že je tam akorát špatně import path :)

Editoval zimmi (15. 1. 2015 10:05)

před 4 lety

duskohu
Člen | 734
+
0
-

Caute snazim sa nahodit weloader na Nette 2.3.0-beta2, webloader mam: „janmarek/webLoader“: „~2.3.0“,
ale Hadze mi to:
notice: Undefined index: webloader\nette\loaderfactory
v : vendor\janmarek\webloader\WebLoader\Nette\Extension.php:159

$meta->value['types']['webloader\\loaderfactory'] = $meta->value['types']['webloader\\nette\\loaderfactory'];

v types sa „WebLoader\Nette\LoaderFactory“ nachadza, nebude nejaky problem s Case sensitivity?

Neviete poradit kde je hacik?

před 4 lety

Mysteria
Člen | 700
+
+2
-

Předpokládám, že to bude tímhle: https://github.com/…3e4af052c0e1

$meta->value['types']['WebLoader\\LoaderFactory'] = $meta->value['types']['WebLoader\\Nette\\LoaderFactory'];

před 4 lety

Jan Mikeš
Člen | 773
+
0
-

Pri tomto zapisu:

webloader:
    css:
        frontend:
            files:
                - {files: ["*.css", "*.less"], exclude: ["*print*"], in: [%appDir%/../www/css, %appDir%/../www/css/frontend]}

Po aktualizaci na nejnovejsi verzi se objevil error is_dir() expects parameter 1 to be a valid path, array given (ve drivejsi verzi vse jelo).

Uprava na tento zapis chybu vyresil:

webloader:
    css:
        frontend:
            files:
                - {files: ["*.css", "*.less"], exclude: ["*print*"], in: %appDir%/../www/css}
                - {files: ["*.css", "*.less"], exclude: ["*print*"], in: %appDir%/../www/css/frontend}

Planuje se vraceni vyuziti predchozi syntax (vyuziti pole v in/from)?

Nasel jsem, ze tento commit, funkcionalitu „rozbil“.

Editoval Lexi (18. 2. 2015 14:33)

před 4 lety

lukasojd
Člen | 3
+
0
-

Tento problém sem vyřešil Filip procházka commitem do webloaderu
https://github.com/…2179a23b36fe

notice: Undefined index: webloader\nette\loaderfactory
v : vendor\janmarek\webloader\WebLoader\Nette\Extension.php:159

ale zatím tento commit není otagovaný

stačilo přidat řádek do composeru
„janmarek/webloader“: „dev-master“,

před 4 lety

flexroad
Člen | 120
+
+1
-

Ahoj vsem,

potreboval bych poradit, jak docilit toho, aby se mi v nette 2.3.2 soubory na „DEVELOPMENT“ neminifikovali do jednoho ale vypsali jako jednotlive radky. neco jako:

<link rel="stylesheet" media="screen,projection,tv" href="/assets/plugins/grido/grido.css">
<link rel="stylesheet" media="screen,projection,tv" href="/assets/plugins/isotope/isotope.css">

Diky za jakekoliv rady a postrehy!

@flexroad

Editoval flexroad (13. 6. 2015 10:05)

před 4 lety

Jeriiii
Člen | 22
+
+1
-

Ahoj,

myslím že jsem opravil stromové načítání less souborů. Tedy když jsem měl v less souboru přidaný jiný soubor pomocí @import např. @import „abc.less“ a soubor abc.less jsem změnil, změna se neprojevila na stránce. Bylo to kvůli tomu, že se vůbec tyto soubory neprohlíželi Compilerem. Proto jsem přidal metody do třídy Compiler.php

/** @var Seznam souborů u kterých se již kontrolovalo, zda nejsou změněné */
private $listCheckFiles = array();

/**
 * Zkontroluje, zda jsou v souboru importy souborů a zda tyto soubory nebyly změněné.
 * @param string $filePath Soubor, u kterého se mají kontrolovat importy.
 * @return int Nejvyšší čas modifikace importovaných souborů.
 */
private function isImportModified($filePath) {
    /* kontrola, zda jde o less soubor */
    if (pathinfo($filePath, PATHINFO_EXTENSION) != 'less') {
        return 0;
    }

    /* kontrola, zda se tento soubor již nekontroloval */
    if (in_array($filePath, $this->listCheckFiles)) {
        return 0;
    }

    $this->listCheckFiles[] = $filePath;

    return $this->checkImportModified($filePath);
}

/**
 * Vypočítá, kdy byl soubor naposledy modifikován.
 * @param string $filePath Soubor, u kterého se mají kontrolovat importy.
 * @return int Čas poslední modifikace.
 */
private function checkImportModified($filePath) {
    $modified = 0;
    $offset = 0;
    $fileContent = file_get_contents($filePath);
    $offset = strpos($fileContent, '@import', $offset);

    while ($offset !== FALSE) {
        /* nalezení importu */
        $startOffsetFile = strpos($fileContent, '"', $offset);
        $endOffsetFile = strpos($fileContent, '"', $startOffsetFile + 1);

        /* nalezení souboru, který se importuje */
        $fileName = substr($fileContent, $startOffsetFile + 1, $endOffsetFile - $startOffsetFile - 1);
        $offset = $endOffsetFile + 1;

        $fileImportPath = dirname($filePath) . '/' . $fileName;

        /* kontrola, zda se tento soubor již nekontroloval */
        if (!in_array($fileImportPath, $this->listCheckFiles)) {
            $this->listCheckFiles[] = $filePath;

            /* pokud nemá koncovku, přidá less koncovku */
            if (pathinfo($fileImportPath, PATHINFO_EXTENSION) == "") {
                $fileImportPath = $fileImportPath . '.less';
            }

            /* zjištění, kdy se naposledy změnil */
            $modified = max($modified, filemtime($fileImportPath));
            $modified = max($modified, $this->isImportModified($fileImportPath));
        }

        $offset = strpos($fileContent, '@import', $offset);
    }

    return $modified;
}

a zavolal jsem je v metodě getLastModified takto:

...
    foreach ($files as $file) {
        $modified = max($modified, filemtime($file));
        $modified = max($modified, $this->isImportModified($file)); //tady kontroluji importované soubory
    }
...

výkonnostně se jedná o zpomalení o cca setiny milisekundy možná méně. Co myslíte?

EDIT: Když by jste to chtěli nasadit, tak si dejte pryč řádek

dump((microtime() - $start));

Editoval Jeriiii (2. 8. 2015 10:27)

před 4 lety

Myiyk
Člen | 321
+
0
-

@Jeriiii hezké, prozatím to obcházím že v hlavním less souboru mám číslo verze a při změně includovaného souboru inkrementuji verzi.

Ideálně kdyby tohle chování taky šlo vypnout.

před 4 lety

Matúš Matula
Backer | 236
+
0
-

@Jeriiii tu sa to myslim riesilo, hod tam ked tak aspon link, idealne PR. Dik :)

před 4 lety

Jeriiii
Člen | 22
+
0
-

@Myiyk Myslím, že není potřeba to vypínat, protože se to spouští opravu jen na less soubory. Kdyby jsi ale přesto chtěl, můžeš to udělat jednoduše přes globální proměnnou Compileru a jeden if, třeba takto (neodzkoušeno):

/* zapne kontrolu, zda byly modifikovány importované less soubory */
public $checkImportLessFiles = TRUE;

/* původní metoda na zjištění poslední modifikace */
public function getLastModified(array $files = null) {
    if ($files === null) {
        $files = $this->collection->getFiles();
    }

    $modified = 0;

    foreach ($files as $file) {
        $modified = max($modified, filemtime($file));
        if($this->checkImportLessFiles) { //zapnutí / vypnutí kontroly
            $modified = max($modified, $this->isImportModified($file)); //kontrola všech importů
        }
    }

    return $modified;
}

Takhle si to pak zapneš/vypneš u každé instance jak chceš. :-)

@MatúšMatula Díky, hodím to tam.

před 3 lety

Oli
Člen | 1219
+
0
-

Zdravím, měl bych 2 dotazy. Prvně jak to mám:

extensions:
    webloader: WebLoader\Nette\Extension

webloader:
    css:
        default:
            files:
                - style.css
                # další styly
            filters:
                - @wlCssFilter
        admin:
            files:
                - admin_style.css
                # další styly
            filters:
                - @wlCssFilter
    js:
        # to není podstatný

services:
    wlCssFilter: WebLoader\Filter\CssUrlsFilter(%wwwDir%)
/**
 * @autowire
 * @var \WebLoader\LoaderFactory
 */
protected $webLoader;

protected function createComponentCss()
{
    return $this->webLoader->createCssLoader('default');
}

To je v podstatě vše.

A Teď k otázkám:

  1. Proč mě to v WebLoader\Filter\CssUrlsFilter naplňuje tenhle řádek prázdnou hodnotou pro $cssFile? Pokud je $url absolutní, tak nic v pohodě, pokud ale není, tak to nastaví $cssFile na NULL a vrátí to původní hodnotu z $url.
  2. Jde nějakým způsobem pracovat s css.map soubory? Přenést do webtemp složky nebo změnit cestu k nim aby si to našlo i z toho novýho umístění?

před 3 lety

CZechBoY
Člen | 3312
+
0
-

Zdravím,
chystá se někdy rozšíření pro generování source map?

před 3 lety

Ja
Člen | 253
+
0
-

Zdravim,
je možné na localu skripty neminifikovat a neslucovat?

Pokud ne, tak jak to resite kdyz potrebujete sahat do stylu pri vyvoji?
Diky!

před 3 lety

Tirus91
Generous Backer | 199
+
0
-

Měl bych na vás menší dotaz.
Od té chvíle, kdy jsem tuto fičuru začal používat, mi přestalo fungovat komplet nette js

V konfigu mám toto. Vzal jsem vše co jsem měl v @layout.latte a přesunul jen sem (pořadí jsem zachoval). Netuší někdo, co by s tím mohlo být? V konzoli browseru dostávám error, že $.nette není definováno

webloader:
    css:
        default:
            files:
                - %appDir%/../webLibs/stylesheets/pixel-admin.css
                - %appDir%/../webLibs/stylesheets/widgets.css
                - %appDir%/../webLibs/stylesheets/pages.css
                - %appDir%/../webLibs/stylesheets/themes.css
                - %appDir%/../webLibs/stylesheets/main.css
                - %appDir%/../webLibs/stylesheets/grido.css
            remoteFiles:
                - "http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,400,600,700,300&subset=latin"
                - https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css
                - https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css
                - https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.10.0/css/bootstrap-select.min.css
            filters:
                - @cssMin
    js:
        default:
            files:
                - %appDir%/../webLibs/javascripts/pixel-admin.js
                - %appDir%/../webLibs/javascripts/nprogress.js
                - %appDir%/../webLibs/javascripts/bootstrap.datetimepicker.js
                - %appDir%/../webLibs/javascripts/nette.ajax.js
                - %appDir%/../webLibs/javascripts/grido.js
                - %appDir%/../webLibs/javascripts/plugins/grido.nette.ajax.js
                - %appDir%/../webLibs/javascripts/plugins/grido.datepicker.js
                - %appDir%/../webLibs/javascripts/plugins/grido.bootstrap.select.js
                - %appDir%/../webLibs/javascripts/plugins/grido.bootstrap.paginator.js
                - %appDir%/../webLibs/javascripts/plugins/grido.daterangepicker.js
                - %appDir%/../webLibs/javascripts/nette.nprogress.js
            remoteFiles:
                - https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js
                - https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js
                - https://cdn.rawgit.com/dangrossman/bootstrap-daterangepicker/v1.3.19/daterangepicker.js
                - https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.10.0/js/bootstrap-select.min.js
                - https://nette.github.io/resources/js/netteForms.min.js
            filters:
               - @jsMin

před 2 lety

d@rkWolf
Člen | 48
+
0
-

Měl bych dotaz, je možné nakonfigurovat aktuální verzi Webloaderu(a aktuální Nette 2.4) tak, abych mi na localhostu nekomprimoval všechny CSS a JS soubory? Protože s jedním kilometrovým řádkem CSS stylů se bohužel nedá designovat. Už se v tom vrtám nějakou chvíli, ale jediné, co se mi podařilo pochytit je parametr:

joinFiles: FALSE

který zamezí spojení souborů, nicméně stále se soubory neustále vytvářejí do WebTemp(a minifikují) nějak takto „cssloader-e1b56949a973-web.css“, vážně není možnost, jak to nakonfigurovat, aby se vložily přímo(mimo less který se musí kompilovat) a neminifikovaly? Nebo mi uniká nějaký parametr nastavení? Nebo je jediná možnost nakopírovat si konfiguraci do config.local.neon bez filterů? Nevím, co to udělá s less soubory.

před 2 lety

CZechBoY
Člen | 3312
+
0
-

Minifikaci dela minifikacni filter, tak si ho vypni…
Jinak mne by se libila source mapa – mapovani souboru z ty nudle cssloader.css, jsloader.js(soubor .map) na zdrojaky.

Editoval CZechBoY (12. 10. 2016 8:39)

před 2 lety

d@rkWolf
Člen | 48
+
0
-

@CZechBoY mě by přišlo nejlepší úplně se bez zarábění s těmi soubory na dev obejít, asi by to muselo mít nějaký specifikum kvůli cestám k obrázkům, ale prostě je jen vylistovat tak jak jsou zadané, přijde mi to jako plýtvání výpočetním výkonem je na devu byť jen přepisovat(jak jsem si to teď nakonfiguroval do local.neonu, s vypnutými filtry a nastaveným joinFiles na false), ale jo, i ten .map by byl určitý řešení, ale jak na to to fakt netuším.

před rokem

Trsak
Člen | 21
+
0
-

Zdravím,
k čemu je vlastně dobré mít v konfikuraci watchFiles?

watchFiles:
    - {files: ["*.css", "*.less"], from: css}
    - {files: ["*.css", "*.less"], in: css}

Editoval Trsak (30. 9. 2017 20:29)

před rokem

pitr82
Člen | 120
+
0
-

Dobrý den,
mám nainstalované fonts awasome přes bower. A špatně se mi detekuje URL pro načítání fontů.

src: url('../fonts/fontawesome-webfont.eot?v=4.7.0');

zatím jsem fonty zkopíroval do wwwDir.

Ještě bych mohl editovat @fa-font-path: a přegenerovat less soubor…

Jak tohle řešíty vy?

před rokem

ali
Člen | 284
+
0
-

Kvuli font awesome jsem si napsal vlastni webloader, ve kterem si namapujes slozku, z ktere ti vykopiruje soubory do www dir.. (v dobe kdy jsem neco takoveho potreboval, jsem u tohodle webloadru nezjistil jak dosahnout potrebneho efektu).

před rokem

JohnyRicio
Člen | 1
+
0
-

Pomocí gulpu automaticky kopíruji věci node_modules nebo vendorů co potřebuji do www. pak jsou data dostupné

před 10 měsíci

brano
Člen | 23
+
0
-

Po upgrade zo staršej verzie WebLoaderu bojujem s nahradzovaním URL.

Obkreslil som konfiguráciu config.neon z GitHub-u a mierne upravil na moje podmienky:

extensions:
    webloader: WebLoader\Nette\Extension

services:
        router: RouterFactory::createRouter
        wlCssFilter: WebLoader\Filter\CssUrlsFilter(%wwwDir%)
        lessFilter: WebLoader\Filter\LessFilter

webloader:
    css:
        default:
            files:
                - {files: ["*.css", "*.less"], from: %wwwDir%/css} # Nette\Utils\Finder support
            filters:
            fileFilters:
                - @lessFilter
                - @wlCssFilter
            watchFiles:     # only watch modify file
                - {files: ["*.css", "*.less"], from: css}
                - {files: ["*.css", "*.less"], in: css}

    js:
        default:
            remoteFiles:
            files:

Prestali sa mi však nahrádzať odkazy k obrázkom v CSS. Napr.:

.tip {
    background-image:url("tip1.gif");
}

Môže za to tento kus kódu:

// inside document root
if (strncmp($cssFile, $this->docRoot, strlen($this->docRoot)) === 0) {
    $path = $this->basePath . substr(dirname($cssFile), strlen($this->docRoot)) . DIRECTORY_SEPARATOR . $url;
} else {
    // outside document root we don't know
    return $url;
}

Premenná %wwwDir% a teda $this->docRoot smeruje správne na absolútnu cestu k web rootu, teda napr. ‚C:\xampp\htdocs\project\www‘. $cssFile je nastavené napr. ‚css/style.css‘, teda podmienka sa vyhodnotí ako false. Krízovo som to vyriešil tým, že som upravil else vetvu:

// inside document root
if (strncmp($cssFile, $this->docRoot, strlen($this->docRoot)) === 0) {
    $path = $this->basePath . substr(dirname($cssFile), strlen($this->docRoot)) . DIRECTORY_SEPARATOR . $url;
} else {
    // outside document root we don't know
    $path = $this->basePath . dirname($cssFile). DIRECTORY_SEPARATOR . $url;
}

Nejaký nápad čo by som mal ešte skontrolovať, prípadne ako to elegantne vyriešiť? Ostatným to ide bez problémov? Popravde moc mi tá podmienka nedáva zmysel. Ako máte $cssFile nastavený vy? Ako je to myslené?

před 8 měsíci

cafesk8
Člen | 67
+
0
-

Zdravím,

v config.neon mám:

extensions:
    webloader: WebLoader\Nette\Extension

services:
    wlCssFilter: WebLoader\Filter\CssUrlsFilter(%wwwDir%)
    lessFilter: WebLoader\Filter\LessFilter

webloader:
    css:
        default:
            files:
                - {files: ["*.css", "*.less"], from: %wwwDir%/css} # Nette\Utils\Finder support
        filters:
        fileFilters:
            - @lessFilter
            - @wlCssFilter
        watchFiles:     # only watch modify file
            - {files: ["*.css", "*.less"], from: css}
            - {files: ["*.css", "*.less"], in: css}

V BasePresenteru mám potom:

class BasePresenter extends Nette\Application\UI\Presenter {
    /** @var \WebLoader\Nette\LoaderFactory @inject */
    public $webLoader;

    /** @return CssLoader */
    protected function createComponentCss()
    {
        return $this->webLoader->createCssLoader('default');
    }
}

Soubory mi to ze složky vytáhne, ale nepřekompiluje mi to LESS proměnné např:

@pink: #fac;

body {
    color: @pink;
}

Měl jsem za to, že od toho jsou právě v config.neon ty řádky s LESS filterem.

Poradíte mi někdo prosím. Nebo používáte někdo na kompilace a případnou minifikaci z LESS nějakou jinou komponentu, přece jen je tato komponenta 3 roky neaktualizovaná.

Stránky: Prev 1 … 5 6 7 RSS tématu