Laravel预设React:执行`npm run dev`时遇到的问题

I have some issues with using React in Laravel 5.5. Every time I add or make changes to a component, I have to run npm run dev to compile the thing. When I do this the contents of css/app.css get reset, so I cannot write styles to this file.

Styles get unchanged if I have them in another CSS file, but I'd like to have my main styles written in css/app.css.

How can I do this?

Keep all your css styles in a file in your resources directory and add the below code to end of your webpack.mix.js file.

mix.styles('path to your css file in resources directory', 'public/css/app.css');

If you are using sass use the below code

mix.sass('path to your css file in resources directory', 'public/css/app.css');

Also you no need to run npm run dev each time you make changes to your components. just run npm run watch and it will continuously look for changes and re-compile the components if anything is changed.