Sage: Yarn start removes styles folder from dist (Sage 9)

[fu-raz]

Submit a feature request or bug report

• [X] I've read the guidelines for Contributing to Roots Projects
• [ ] This is a feature request
• [X] This is a bug report
• [X] This request isn't a duplicate of an existing issue
• [X] I've read the docs and NPM Debugging Guidelines post and followed them (if applicable)
• [X] This is not a personal support request that should be posted on the Roots Discourse forums

---

What is the current behavior?

I'm trying Sage 9 for the first time and I'm running into the problem that Yarn seems to delete my styles folder in dist when I use yarn run start.

After a fresh install with Foundation as the css framework I run yarn && yarn build. I see the compiled files in my dist folder. Then when I run yarn start or yarn run start, everything seems to work, but the styles directory in dist gets deleted.

What is the expected or desired behavior?

Well I don't know if this is the desired behavior, but to me it seems that the styles folder in dist should not be deleted.

---

Bug report

Please provide steps to reproduce, including full log output:

This is what I did a few times:
Create a new project using
composer create-project roots/sage whatever dev-master
Fill everything as desired but choose [3] Foundation as css framework
Choose to install Font-Awesome
Choose to overwrite the files
Go to the theme directory and run yarn && yarn build
Check the dist folder, the styles directory is there.

Run yarn run start
Browser opens, I can use the site and see the style changes I made.
Check the dist folder, the styles directory is gone.

Please describe your local environment:

WordPress version: Latest version installed with Bedrock 4.8.2

OS: OSX High Sierra 10.13

NPM/Node version: NPM 5.3.0, node 8.6.0

Where did the bug happen? Development or remote servers?

Development

[fu-raz]

Please read
https://discourse.roots.io/t/sage-9-beta-4-browser-sync-doesnt-update-the-styles/10364/12
https://discourse.roots.io/t/sage-9-main-css-404-on-devurl/9799/33

I should have.

[trainoasis]

Quote from the links provided by @fu-raz, for the lazy heads (text by MWDelaney):

Yes, this is intended behavior because of the way webpack works. main.css is compiled and injected by webpack during yarn start and you will always get a 404 message for main.css when using yarn start .

If you run yarn build you won’t get this message, but you also won’t get browsersync and live-preview of your changes.