Yarn dev not watching

sage
, ,
1

Hello,

I seem to be running into an issue - when I run yarn dev it does not watch my changes - for example, it does not recompile my Taiwind CSS on Sage 10 with Bedrock.

My bud.config is set to watch what it should - yet nothing happens. i have to run yarn build in order to see my changes, which obviously - takes a lot more time

My bud.config:

.watch(["resources/views/**/*", "app/**/*"])

Thanks!

2

Howdy!

This isn’t reproducible from a fresh install — what changes are you making?

As of right now, there’s not enough details in this topic to provide you with support. Please either show us exactly what you’re trying, either with words or with a video.

4

Literally - none. I am installing Bedrock via composer, the Sage 10 via composer and running it under Wamp64 and PHP 8.0 under WLS on Windows.

Should I run it under the built-in dev server?

5

image
image928×436 14.8 KB

So when I run yarn dev - I get this - which seem s OK.

Then for the test sake, I add a color class to a sample paragraph:

image
image1913×909 142 KB

And color is not applied, because Tailwind classes are not recompiled. This is a fresh installation of Bedrock/Sage, with literally one change - adding the Hello World

Could it be because I am changing the file under Windows and running yarn under the Linux subsystem, which might not detect the change?

6

Thank you for the additional details!

Looks like this is likely to be the issue. Per [WSL2] File changes made by Windows apps on Windows filesystem don't trigger notifications for Linux apps · Issue #4739 · microsoft/WSL · GitHub, maybe using a symlink would work?

1 Like
7

Thanks. Can you please elaborate? How should I use symlink?

8

Nope, not eve a nano from the WSL console solved the issue. I still cannot make yarn follow the changes of the files I need.

Is this the correct watch list from bud.config:

.watch(["resources/views/**/*", "app/**/*"])

Anything else I might be misssing?

9

Problem solved. Started coding from WSL itself - and all seems fine. No symlinking needed, since Windows follows fil changes through Linux

Thanks for your help!

1 Like
10

Can you explain what this means? You edited inside of wsl, like using VI rather than a IDE like sublime? I think i’m having the same issues, and cannot figure this out. Thanks

11

The issue was that no matter what I did, I couldn’t use the development mode - i.e. seeing any change on the frontend required for me to re-run yarn build, which was not very convenient.

Yet, the issue turned out the be the way that WSL 2 treats the filesystem, as changes made under Windows cannot be tracked in WSL.

What fixed my issue was downgrading to WSL 1 and Sage works like a charm. Hope this helps.

13

It’s possible that setting polling options in your bud.js config would get things to work with WSL 2

https://bud.js.org/reference/bud.watch#setting-options

In a default Sage 10 install, that might look like this:

app
  .setUrl('http://localhost:3000')
  .setProxyUrl('http://example.test')
  .watch(['resources/views', 'app'], {
    interval: 1000,
    usePolling: true,
  });

Changes highlighted:

  app
    .setUrl('http://localhost:3000')
    .setProxyUrl('http://example.test')
-   .watch(['resources/views', 'app']);
+   .watch(['resources/views', 'app'], {
+     interval: 1000,
+     usePolling: true,
+   });

Ref sage/bud.config.js at f1b9646655b6b95a257d80947996628ab7de4240 · roots/sage · GitHub

14

Unfortunately, the issue is a bit deeper on the kernel level, namely on how WSL 2 and WSL 1 treat files.

I tried with polling without any luck, but downgrading did the job for me.