Css does not load

[jrichardsz]

Actual behavior

Load web at http://localhost:9100/ after configuration wizard successfull and css does not load.

Expected behavior

Load web normally.

Steps to reproduce the behavior

• Follow this tutorial https://docs.requarks.io/wiki/install for linux machine.
• node wiki stop
• node wiki start
• point browser at http://localhost:**some_port**/

hardware

• 16.04.1-Ubuntu

software

• nodejs v6.11.5
• wiki.js 1.0.12 (from package.json)

[NGPixel]

Your host config is wrong. See documentation:

https://docs.requarks.io/wiki/troubleshooting#weird-display-no-styling

[jrichardsz]

Hi NGPixel.

I have followed https://docs.requarks.io/wiki/troubleshooting#weird-display-no-styling and manually I fixed my config.yml port parameter and style loads perfect, thanks for that!!

Here my feedback:

• I follow all the steps in the official tutorial , so why my host parameter located in config.yml is wrong ? Maybe it is a bug.
• If you point me to wizard files, I could fixe it.
• I was looking this jade https://github.com/Requarks/wiki/blob/master/server/views/layout.pug and css is not loaded. But after start the wiki and review my browser console I see that css is attached at the bottom of header :

<style id="scss-app-scss" type="text/css">html,body,body div,span,object,iframe,h1,h2,h3,h4,h5,h6,p .............

So I appreciate if you explain me how do you do :) and why a src "old school mode" is not used :

style(type='text/css', src=appconfig.host + '/css/main.css')

Thanks for your time and thanks for your wiki.

Regards,

Richard Leon
(jrichardsz)

[NGPixel]

• It is not a bug. The port Wiki.js listens to and the port the client access can be different. When using a reverse proxy, these ports are different. This is why you must set it in the host parameter if different than 80 or 443.

• CSS is bundled with the js file. It is then injected on page load. It reduces the number of network calls.

[matthewepler]

I've followed the above and am still having trouble getting linked stylesheets and JS files to load. I've included setup details below. What am I doing wrong? @jrichardsz any tips for the fellow sufferer?

My Digital Ocean IP Address = 45.55.151.65
My config.yml file (partial):

title: dev wiki
host: 'http://45.55.151.65'
port: 80
...etc

The console shows the following errors:

GET http://localhost/js/vendor.js net::ERR_CONNECTION_REFUSED
GET http://localhost/js/app.js net::ERR_CONNECTION_REFUSED

I'm confused why the network requests are pointed at localhost when my config has a defined IP address.

I've restarted the app every time I edited the config.yml file.

[kalsan]

Above links are invalid, the new URL is https://docs.requarks.io/wiki/install/troubleshooting

[shayanpaul91]

Actual behavior

Load web at http://localhost:9100/ after configuration wizard successfull and css does not load.

Expected behavior

Load web normally.

Steps to reproduce the behavior

• Follow this tutorial https://docs.requarks.io/wiki/install for linux machine.
• node wiki stop
• node wiki start
• point browser at http://localhost:**some_port**/

hardware

• 16.04.1-Ubuntu

software

• nodejs v6.11.5
• wiki.js 1.0.12 (from package.json)

i did this by adding the port number along with the ip..
example: http://localhost:8080

[DylanRobinson]

I came across this page searching for a similar issue with supplementary CSS not loading. Similar to what @jrichardsz posted above on December 1, 2017. Turns out the code I put in the pug file was wrong, had nothing to do with server config or reverse proxy.

To link additional stylesheets, use:

link(rel='stylesheet', href='/css/main.css')

Remember that styles declared later win, so add custom stylesheets to be bottom of the // JS / CSS section in the Pug file to override any default styles.

Also for those trying to troubleshoot changes to the view pages, or if you're just adverse to learning Pug, https://pughtml.com is a decent converter.

[hugomarshall]

Just set the port like

Actual behavior

Load web at http://localhost:9100/ after configuration wizard successfull and css does not load.

Expected behavior

Load web normally.

Steps to reproduce the behavior

• Follow this tutorial https://docs.requarks.io/wiki/install for linux machine.
• node wiki stop
• node wiki start
• point browser at http://localhost:**some_port**/

hardware

• 16.04.1-Ubuntu

software

• nodejs v6.11.5
• wiki.js 1.0.12 (from package.json)

i did this by adding the port number along with the ip..
example: http://localhost:8080

This is work for me, set the port in host too!