Merged JS and CSS do not work when Production mode

Question

I was in developer mode, everything was great, when I changed to Production mode, the Merged options of CSS and JS seem to be ignored, it was back listing all css and js.

Also the product page only shows the pictures of the product in developer mode, after changing to production mode they disappear.

Any thought to help me?

The point is, I'm doing it.

Here is what I did in sequence:

bin/magento setup:upgrade

bin/magento indexer:reindex

bin/magento setup:static-content:deploy

bin/magento setup:di:compile

bin/magento deploy:mode:set production

bin/magento setup:static-content:deploy

And before even starting, the Merge options are YES and I was in developer mode.

Hello, Have you got any solution of this issue, I am getting same issue in magento 2.0.7. Please give the solution if you have any, Thanks — Ashish Jagnani, Oct 03 '16 at 09:36

score 22 · Answer 1 · edited Mar 08 '19 at 01:29

22

I just did the following and the problem was solved:

bin/magento setup:upgrade

bin/magento indexer:reindex

bin/magento deploy:mode:set production -s

# Here was the secret: run the di:compile after production
bin/magento setup:di:compile  

bin/magento setup:static-content:deploy

edited Mar 08 '19 at 01:29

the

331
4
16

answered Mar 16 '16 at 17:23

user37025

1,383
3
19
32

2

i tried same way but no luck – Pradeep Kumar May 31 '16 at 08:30
This worked for me. – dchayka Jan 10 '17 at 15:55
If i execute command "production -s" it blank my site and give very unusal error: Warning: include(/siteRoot/html/var/view_preprocessed/html/vendor/magento/module-theme/view/base/templates/root.phtml): failed to open stream: No such file or directory in /siteRoot/html/vendor/magento/framework/View/Result/Page.php on line 312 – Jarnail S Feb 24 '17 at 09:25
Another - that worked for me. In case anyone else is having the problem I was. CSS would minify and bundle, but JS would not, despite having the options enabled in the admin. Adding the -s in the set product mode made all the difference. Also, the backend is MUCH faster now as well. I was using the same order and commands, but it was the "-s" that made the difference, Thank you – dawhoo Mar 26 '17 at 20:31
Do i first need to switch back to development mode? I did what you mentioned, but no difference.... – Jilco Tigchelaar Jul 24 '17 at 18:22
I had the same issue. It would not load images in production mode and I couldnt get my backend to work. The wheel would just spin. When I did it on a development subdomain it worked fine, but on the production domain where SSL is enabled, I get the spinning wheel for images (on product page) and backend. – styzzz Jul 27 '17 at 21:53
Worked for me GREAT – Sayyed Hasan Oct 11 '21 at 20:22

score 2 · Answer 2 · answered Sep 30 '16 at 05:13

Make sure you check your NGINX configuration file as well.

If there is a variable $MAGE_MODE set there it needs to be changed to production as well, and save the file

After that you will need to reload or restart NGINX depending on your preference.

sudo service nginx reload

OR

sudo service nginx restart

After that check your app/etc/env.php and see if the MAGE_MODE array key is set to production as well if not change it to production or you can use the command

php bin/magento deploy:mode:set production

After you executed the command check if the value changed app/etc/env.php, sometimes there might be permission issues.

Next, clean out the pub/static folder.

rm -rf pub/static/*

Clear/Flush your cache

php bin/magento cache:clean
php bin/magento cache:flush

Now you are ready to execute the static content deploy

php bin/magento setup:static-content:deploy

Hope this helps.

score 1 · Answer 3 · answered Jun 18 '16 at 08:47

I have the similar issue. The cause for no image is because there is an error in JS file after minify JS. You can verify it in your browser (firebug etc).

.../div>';return __p};})(window,document,location,typeof jQuery!=='undefined'&&jQu

I solved this by remove all the file in var/cache/ and pub/static/ and setup:static-content:deploy again

But there is still another issue, it's about the braintree if you enable it. Braintree doesn't show up due to another JS error.

Error: Script error for: https://js.braintreegateway.com/v2/braintree.js http://requirejs.org/docs/errors.html#scripterror

...Error(id,msg,err,requireModules){var e=new Error(msg+'\nhttp://requirejs.org/doc...

For now, I simply don't use the minify js function to avoid the trouble until solution is found.

Matthew · Answer 4 · 2017-07-28T04:46:23.460

These are the steps that worked for me on Magento ver. 2.1.7 with Redis (not running Varnish). However, it's still unclear if everything is working as it should. JS is minified and bundled (unclear what merge is supposed to do). CSS is minified (not seeing it merged).

Turn off all Magento cache.
Clear redis cache.
Turn all five css/js configs on (either in admin or via database).
Generate static files.
Clear Magento cache (command line). For safety (may not be required).
Clear opcache (if not set to auto refresh).
Refresh frontend home page (and check browser console for errors).
Turn on Magento cache.

dev/css/merge_css_files = 1 dev/css/minify_files = 1 dev/js/enable_js_bundling = 1 dev/js/merge_files = 1 dev/js/minify_files = 1

Simply turning on the configs and clearing cache didn't work -- the frontend browser console reported a lot of js errors.

Merge will merge your files together into one. – ladle3000 Oct 05 '18 at 13:45 — ladle3000, Oct 05 '18 at 13:45

score 0 · Answer 5 · answered Mar 15 '16 at 23:15

0

Have you tried to flush the JavaScript/CSS? You can do this under System>Cache Management and then press the button which is on the bottom of the table on the left 'Flus JavaScript/CSS Cache'

answered Mar 15 '16 at 23:15

Mr. Lewis

1,931
12
13

YEP.... flush js, then cache. Nothing change. However, if I switch to Developer mode, the merge works. – user37025 Mar 16 '16 at 17:03

score 0 · Answer 6 · answered Mar 16 '16 at 05:28

0

You need to redeploy static after enabling this option in production mode.

answered Mar 16 '16 at 05:28

KAndy

20,811
3
49
59

The point is, I'm doing it. I just posted here what I did. – user37025 Mar 16 '16 at 17:02
If it not works then problem maybe in in permission. Can you check your webserver access/errors log – KAndy Mar 17 '16 at 14:01

score 0 · Answer 7 · edited Jul 26 '17 at 07:06

0

I just did the following and the problem was solved.

bin/magento setup:upgrade

bin/magento indexer:reindex

bin/magento deploy:mode:set production -s

bin/magento setup:di:compile

(Here was the secret, to run the di:compile after production)

bin/magento setup:static-content:deploy

edited Jul 26 '17 at 07:06

Devtype

3,008
3
24
36

answered Jul 26 '17 at 06:48

score 0 · Answer 8 · answered Jan 14 '18 at 02:51

I've had the problem when the JavaScript is un-compiled the jquery selector works.

$('#my_element').click(function(){ alert('Hello World');});

But once compiled, compressed and joined, I then need to code:-

$('body #my_element').click(function(){ alert('Hello World');});

Don't ask why, it seems that when reading directly from the cache, the requirejs code executes before the domReady and the elements attach to different elements in some different page.

score 0 · Answer 9 · answered Sep 26 '20 at 12:41

Please check your pub/static folder. Maybe the www-data group doesn't have a write permision to create _cache folder. I've deleted static folder manually in command line. Therefore it can not create _cache folder.

Take a look at var/log/exceptions.log: tail -f var/log/exception.log In my case:

[2020-09-26 12:28:24] main.CRITICAL: Le répertoire "/data/var/www/preprod/www/pub/static/_cache" ne peut être crée Warning!mkdir(): Permission denied {"exception":"[object] (Magento\\Framework\\Exception\\FileSystemException(code: 0): Le répertoire \"/data/var/www/vgc-preprod/www/pub/static/_cache\" ne peut être crée Warning!mkdir(): Permission denied at /data/var/www/preprod/www/vendor/magento/framework/Filesystem/Driver/File.php:227)"}

So:

chmod 777 -r pub/static

Hope it can help.

score 0 · Answer 10 · answered Sep 20 '22 at 13:54

If already check in database that css and js merge enabled and also checked all deployment commands but after deployment it getting rolled back and sowing not merge on browser.

Same happened with because i used custom deployment pipeline with nginx server. so, i checked and set the files and directory to write permissions for system owner as user.

sudo find . -type f -exec chmod 664 {} \;
sudo find . -type d -exec chmod 775 {} \;
sudo find var pub/static pub/media app/etc -type f -exec chmod g+w {} \;
sudo find var pub/static pub/media app/etc -type d -exec chmod g+ws {} \;
sudo chmod u+x bin/magento

It worked well to me.

Happy Coding!!

score -1 · Answer 11 · answered Mar 16 '16 at 18:05

-1

Delete cache manually var/cache and delete session manually var/session

answered Mar 16 '16 at 18:05

Usman Fayyaz

104
1
2

1

Deleting var/session is never an appropiate solution. http://magento.stackexchange.com/questions/94589/keeping-customers-logged-in-after-deleting-var-session – Fabian Schmengler Sep 14 '16 at 10:42

score -1 · Answer 12 · edited Jul 26 '17 at 07:17

-1

Please also enable "Enable JavaScript Bundling" option

store->configuration->advanced->developer->javascript setting->
Enable JavaScript Bundling set to "yes" And flush cache

edited Jul 26 '17 at 07:17

Teja Bhagavan Kollepara

3,816
5
32
69

answered Sep 30 '16 at 04:56

Sagar Dobariya

2,895
2
24
47

2

Haphazard advice that has nothing to do with the question. – ladle3000 Oct 05 '18 at 13:46

Merged JS and CSS do not work when Production mode

12 Answers12

Linked