volodymyr-lisniak / magento-2-gulp Goto Github PK

Hi

Thank you for the extension. I am trying it out on my Magento store.

However, I am stuck on the step where I have to copy package.json.sample-aws to package.json because I already have Magento's package.json file for grunt.

How should I handle this?

I am getting this error when trying to run gulp commands.

gulp clean --clothing && gulp exec --clothing && gulp less --clothing --map --min

Getting below error.

internal/modules/cjs/loader.js:979
  throw err;
  ^

Error: Cannot find module 'strip-ansi'

I tried installing strip-ansi package but still getting the same error.

npm i strip-ansi

Hi There,

Im having trouble getting browsersync up and running (more likely due to my limited experience with browsersync and not your code). Any way Ive got everything else installed and set up correctly (I can run all other gulp commands successfully) however when I run the following:

gulp watch-styles --myTheme --bs

Im getting the following error:

tunnel server offline: unable to verify the first certificate, retry 1s

Ive played around with a few different settings in the local.js but no luck getting it up and running as yet

In magento 2 you can enable it so pub is your root for the frontend (to improve security). This is recommended by the Magento team.

This means that in urls the "pub" part is dropped (since it's the root).

In env.php

'directories' => [ 'document_root_is_pub' => true ],

enables this functionality.

I guess this module would need to detect if this is enabled or not and adjust the criticalCssPath as appropriate.

Hello,
Thank you very much this is being really useful!

Well, I'm using another font-family pattern, and critical.css is generating the wrong address, returning 404 which is really bad, any tips on how to solve it?

Hi, do you have any problem with sourcemaps? I lost it from time to time. When I manualy refresh page then everything is fine, but when I do any changes in less files then sometimes I lost sourcemap, then instead for example *\*\_module.less I get *\*\styles-m.css?livereload=1585657356640 on BrowserSync this same, browser Chrome latest version.

Hi,

I've been using this repo for a while now and it's great! Now we switched to docker based environments. We nearly got this working with the latest version 1.5.2, but my livereload does not work correctly. Is there an example available for this maybe somewhere?

Try gulp task critical for my theme localy
Theme used compact mode static content deploy
Install all dependencies but got fail after run
gulp critical --mytheme

[15:25:09] Working directory changed to ~/web/html/src
[15:25:10] Using gulpfile ~/web/html/src/gulpfile.js
[15:25:10] Starting 'critical'...
Running gulp task Critical CSS compilation for 1 theme(s):
mytheme
[15:25:10] Finished 'critical' after 81 ms
[15:25:10] ✗ FAIL: Missing 2 expected files: pub/static/frontend/Theme/mytheme/en_US/css/styles-m.css, pub/static/frontend/Theme/mytheme/en_US/css/styles-l.css
[15:25:10] Tested 1 tests, 0 passes, 1 failures: FAIL

This is not a bug i think we should have integrate gulp task uncss to reduce unused css would be nice feature. Similar purgeCss from tailwindcss
Maybe have better package than uncss out there

package may be related postcss-uncss gulp-purgecss

We can allow config entrypoints to same common page for purging styles unused (home, category, details product page)
Default styles of magento quite big and only ~20-30% used

Please add a license :-)

I found this tool today and when I tried I got this error. Is it something that I am doing wrong?

[16:23:20] Using gulpfile C:\xampp\htdocs\m2\gulpfile.js
[16:23:20] Starting 'critical'...
Running gulp task Critical CSS compilation for 1 theme(s):
pmcArceus
[16:23:20] 'critical' errored after 17 ms
[16:23:20] TypeError: plugins.expectFile is not a function
at C:\xampp\htdocs\m2\dev\tools\gulp\tasks\critical.js:44:31
at Array.forEach ()
at module.exports (C:\xampp\htdocs\m2\dev\tools\gulp\tasks\critical.js:41:36)
at critical (C:\xampp\htdocs\m2\node_modules\undertaker\lib\set-task.js:13:15)
at bound (domain.js:413:15)
at runBound (domain.js:424:12)
at asyncRunner (C:\xampp\htdocs\m2\node_modules\async-done\index.js:55:18)
at processTicksAndRejections (internal/process/task_queues.js:75:11)

Hello,

Magento ver. 2.3.2
Ubuntu 20.04
Apache
PHP 7.4
gulp -v
CLI version: 2.3.0
Local version: 4.0.2

gulp watch-styles --kt2 --map --live

Don't know what info to give you more

Слава Україні!

Hello,

I'm just a beginner but i added "bobmotor/magento-2-gulp":"~1.2.0" to my root composer.json file in Magento2, and after running "composer update --prefer-source", i get the following error:

└╼ composer update --prefer-source
Gathering patches for root package.
Loading composer repositories with package information
Updating dependencies (including require-dev)
Your requirements could not be resolved to an installable set of packages.

Problem 1
- The requested package bobmotor/magento-2-gulp could not be found in any version, there may be a typo in the package name.

Potential causes:

• A typo in the package name
• The package is not available in a stable-enough version according to your minimum-stability setting
  see https://getcomposer.org/doc/04-schema.md#minimum-stability for more details.
• It's a private package and you forgot to add a custom repository to find it

Read https://getcomposer.org/doc/articles/troubleshooting.md for further common problems.

Am i doing something wrong?

Could you please submit this to packagist.org?

I've been playing with browsersync: gulp watch-styles --base --bs It looks like it's only applying and reloading the browser the first time I make a changes in my _theme.less file. All other times it's like nothing is happening in terminal. It's not firing the command again.

bsConfig file:

module.exports = {
    proxy:  `${ptotocol}://${localConfig.hostname}.${localConfig.generic}/`,
    host:   `${localConfig.hostname}.${localConfig.generic}`,
    tunnel: `${localConfig.hostname}`,
    port:   3000,
    open:   false
}; 

Thanks for your great work
I have setup in my local
OS : ubuntu 20.04.1
node: 14.15.3
npm: 6.14.9
Magento use latest current branch

I have updated some dependencies in package.json to more recent version
But when i try run command critical (Production mode in local + all cache enable + run static content deploy)

i got message show
The following tasks did not complete: critical
Did you forget to signal async completion?
Is this normal ?

When i navigate to pub/static/theme i found critical.css file size seem to high comparing with sample luma theme file (Only ~8KB)

First, thanks for the awesome work!

I guess you agree when I say that it is bad practice to touch any core files. Hence, I kindly ask you to switch from the themes.js file to the local-themes.js file. See e.g.:

https://devdocs.magento.com/guides/v2.3/frontend-dev-guide/tools/using_grunt.html#grunt_config
https://devdocs.magento.com/guides/v2.3/frontend-dev-guide/css-topics/css_debug.html#add_theme

Hi,

after using --map arg, I got warning Node flags detected: --map. My node version 10.13.0. When I changed arg value from map to maps everything was fine.

Is this a normal behavior ? After run gulp task gen critical i will expected file get all neccessary styles need for render page without jank or unstyles. In a reality i tested this with default luma theme of magento (not use default magento file critical) .
https://github.com/magento/magento2/blob/2.4-develop/app/design/frontend/Magento/luma/web/css/critical.css

I found this file critical.css generated miss some styles relate (breadcrumbs). This link on top below nav. User while load page may notices some breaks in this component because styles not available soon enough

Here is my screenshot for reference (when page loading)

Expected results
Page should load at early stage without missing styles (look like jank or broken)

Actually results
Some area miss styles can see when page loading!