Add important information about relative imports in css files

[danielniccoli]

I found a solution to a common problem, that was also talked about it here, but without a proper solution: #27

I think it would be very helpful if that info would be added to the docs. It took me hours to figure this out, and I would not want anybody else get troubled by this.

Add server.origin to your vite.config.js:

export default defineConfig({
    server: {
        origin: 'http://localhost:5173',
    },
})

You must use the exact same URL that is displayed when you start Vite. You can't even use 127.0.0.1 if vite runs on localhost or vice versa! It must be equal!

But this will work!

[noxan]

@danielniccoli many thanks for posting this, came across the same problem 👏

[francipvb]

Hello all,

Another issue we found at work is that when you import something in CSS all paths become broken in production environment.

No idea what to do in this case, maybe a problem directly related to vite or the CSS bundler itself.