I have create a new design theme by myself at app\design\frontend Its work at the first time, but I can't update the css using setup upgrade or clean cache after I edit the css. Are there any way to edit the css in design theme and update it?
3 Answers
Once you have made changes to the theme's css (if that theme is using the built in LESS system, you don't say if you are inheriting from the blank or luma), you need to do 2 things to get your styles to show up.
first you need to delete the compiled file in the pub
folder with this command in the root of your magento install:
rm -rf pub/static/frontend/{namespace}/{theme}/en_US/css
You then have to delete the files inside the view_preprocessed
folder with this command in the root of your magento install:
rm -rf var/view_preprocessed/
From there you can clear the cache and then refresh the page and your styles should show. This is predicated that you have set up your LESS files correctly. The right file path should be:
app/design/frontend/{namespace}/{theme}/web/css/source/_extend.less
-
1Thanks, its work, but I should delete all in theme not only styles-m.css. And upgrade setup– Ricky.CCommented Jan 19, 2018 at 6:49
-
that will depend on the different files that you are using. Because i don't know what theme you are using or what files you have set up, i can't say for sure. But you are always save to delete the whole
css
folder just to be sure. I'll update the answer to reflect your question. Commented Jan 19, 2018 at 16:23
Just delete the per-generated static files by command in Magento Root Installation
rm -rf pub/static/*
rm -rf var/view_preprocessed/*
Then re-generate the static files using
php bin/magento setup:static-content:deploy en_LOCALE*
en_LOCALE* - Use this if you have a different locale like GB, AU, CA etc.
-
If you down-vote this answer, please specify the reason Commented Jan 19, 2018 at 10:01
-
i upvoted your answer (don't know who down voted it) since you aren't wrong in your answer. I would note that this method doesn't always work because the css files are cached in the
view_preprocessed
and when you deploy the theme updates wont show. Commented Jan 19, 2018 at 22:05
You can use Client side less compilation for CSS edit.
STORES > Configuration > ADVANCED > Developer > Front-end development workflow > Client side less compilation