Changes to CSS and JavaScript applies only after deploying static content

Question

I installed Magento 2 from the Magento site. I have activated the developer mode by

{project directory}>php bin/magento setup:mode:set developer

Then I have installed my custom theme and finally I deployed my static content by

{project directory}>php bin/magento setup:static-content:deploy

My problem is I have to delete pub/static directory and deploy static content every time to apply the css and javacript changes. The static content deploy process is slow and taking so much time that it is very frustrating. I develop something and have to deploy to get the change to be appeared. Even for very small change. Flushing cache is not helping. Any help would be appreciated. Thanks in advance.

Answer 1

For now you only have this way to apply changes. Magento should be apply changes to pub/static dir but it not. This still know bug. Hope it should be fix soon
You can apply new changes by command as like you do. This way will take some times but should work
My way when i modify js from my extension . I just go to pub dir and clear folder

\pub\static\frontend\Magento\luma\en_US\<Vendor_Module>\js

You can do same with css files when customize styles

Answer 2

Magento have different strategy to materialize static assets.Copy and Link. When you run setup:static-content:deploy this command use Copy strategy and file will be materialized in static folder and will not not change when you change original.

If you cleanup static folder and open page in browser Link strategy will be used and link on original file created. So you will modify source and see changes

Answer 3

But once I removed manually from the \pub\static\frontend\Magento\luma\en_US\Vendor_Module\js directory, it is not auto generated once page loading. For that again, I have to apply command static-content deploy, then there is occurring new changes in the js & css files what I did for module specific.

Answer 4

If you run

bin/magento dev:source-theme:deploy --theme [Vendor]/[theme] --locale <locale>

before the static asset deployment, Magento will create in the pub/static directory symlink (not copy) to the files in vendor.

So you can modify the files in your theme and automatically the files generated in pub/static without run bin/magento setup:static-content:deploy every time.

Now you can use a task runner to compile your files and generate the css.

Answer 5

The problem is that when you delete the whole content of pub/static, you also delete the .htaccess file and this causes your problems with generating symlinks to static resource in developer mode.

So,

1. Don't delete .htacess file.
2. Delete only the directory of your specific theme, ex. delete contents only in pub/static/frontend/Your/theme

From my experience, when using symlinks to static files in Developer mode, you don't need to delete them in order to see your changes. If in doubt, just run

php bin/magento cache:flush