Erpnext Install- Ubuntu 22.04

[yaleellee]

manual install of frappe/erpnext v13 on Ubuntu 22.04 has been ended with the below shown poor look,

It’s not browser issue, the above shown login page appears with several browsers from different devices.

page doesn’t respond to trials to login using admin credentials.
trying to figure out the error sources but frappe logs doesn’t hint.

Please advise

[CA_B.C_Chechani]

Try bench build

[yaleellee]

still the same after running bench build

[CA_B.C_Chechani]

Actually CSS is not loading, you can try bench --site all clear-cache.

[yaleellee]

during build command, the below line appears,
the below CSS related are successful,

...
✔ Application Assets Linked                                                                                                                           

yarn run v1.22.19
$ FRAPPE_ENV=production node rollup/build.js
Production mode
✔ Built js/moment-bundle.min.js
✔ Built js/libs.min.js

Building erpnext assets...

✔ Built js/erpnext-web.min.js
✔ Built js/bank-reconciliation-tool.min.js
✔ Built js/item-dashboard.min.js
✔ Built js/e-commerce.min.js
✔ Built js/erpnext.min.js
...
✔ Built css/erpnext-web.css
✔ Built css-rtl/erpnext-web.css
✔ Built css-rtl/erpnext.css
✔ Built css-rtl/marketplace.css
✔ Built css/erpnext.css
✔ Built css/marketplace.css
✔ Built js/point-of-sale.min.js
✔ Built js/hierarchy-chart.min.js
✔ Built js/marketplace.min.js
✨  Done in 10.314s

Building frappe assets...

✔ Built js/checkout.min.js
✔ Built js/dialog.min.js
✔ Built js/user_profile_controller.min.js
✔ Built js/web_form.min.js
✔ Built js/list.min.js
✔ Built js/bootstrap-4-web.min.js
✔ Built js/frappe-recorder.min.js
✔ Built js/barcode_scanner.min.js
✔ Built js/frappe-web.min.js
✔ Built css/report.min.css
✔ Built css-rtl/report.min.css
✔ Built css/web_form.css
✔ Built css-rtl/web_form.css
✔ Built js/data_import_tools.min.js
✔ Built js/report.min.js
✔ Built css/printview.css
✔ Built css/email.css
✔ Built css/login.css
✔ Built js/desk.min.js
✔ Built css/frappe-web-b4.css
✔ Built css-rtl/frappe-web-b4.css
✔ Built css/desk.min.css
✔ Built css-rtl/email.css
✔ Built js/control.min.js
✔ Built css-rtl/login.css
✔ Built css-rtl/printview.css
✔ Built css-rtl/desk.min.css
✔ Built js/form.min.js
✨  Done in 32.467s
Done in 44.37s.

except,

Assets for Commit 67a607410629f7ee136fa9e15dfc55da0ade876e don't exist
...
Browserslist: caniuse-lite is outdated.
Please run:
npx browserslist@latest --update-db
Browserslist: caniuse-lite is outdated.
Please run next command
`yarn upgrade caniuse-lite browserslist`

running npx browserslist@latest --update-db results in,

npx: installed 6 in 0.79s
Cannot find package.json. Is this the right directory to run `npx browserslist --update-db` in?

running yarn upgrade caniuse-lite browserslist results in,

yarn upgrade v1.22.19
[1/4] Resolving packages...
[2/4] Fetching packages...
[3/4] Linking dependencies...
[4/4] Rebuilding all packages...
success Saved lockfile.
success Saved 0 new dependencies.
Done in 0.04s.

Is that issue related to specific versions of packages components?
the command bench update --requirements should take care of that, am I correct?

[nlublovary]

I had the same issue, page loaded fine when I opened directly via http://127.0.0.1:8000 but it looked messed up when I opened via proxy http://127.0.0.1:80 In my case this was an nginx issue as it could not load the .css and .js files in /assets.

1. nginx had no permission to access files in /assets because nginx was running under user www-data while the /assets folder was owned by erpnext. You can:

• add www-data user to the erpnext group: usermod -aG erpnext www-data
• edit /etc/nginx/nginx.conf and change: user www-data to user erpnext

2. /assets/erpnext and /assets/frappe are symlinks. With certain nginx configs it might ignore symlinks, this is fixed using:

• edit /etc/nginx/nginx.conf and add into the http { section: disable_symlinks off;
• remove both symlinks and use bind in /etc/fstab, for example:
  /opt/erpnext/frappe-bench/apps/erpnext/erpnext/public /opt/erpnext/frappe-bench/sites/assets/erpnext none defaults,bind 0 0

Make sure to restart nginx after applying changes. Good luck.