qwik icon indicating copy to clipboard operation
qwik copied to clipboard

[🐞] Vite's `base` property doesn't affect path for css files

Open timofei-iatsenko opened this issue 2 years ago • 4 comments

Which component is affected?

Qwik Rollup / Vite plugin

Describe the bug

I want to deploy my Qwik App into subpath, example: https://website.com/subpath/

I added base: '/subpath', to the Vite config. It works for js chunks and q:base attribute. They are served from /subpath/build/

However, it doesn't affect css files created from css modules. They are injected directly in to the header as is (without a subpath)

<link rel="stylesheet" href="/build/q-5aaebb6c.css">

This affected code in packages/qwik/src/optimizer/src/plugins/vite.ts:420-440

  injections.push({
      tag: 'link',
      location: 'head',
      attributes: {
        rel: 'stylesheet',
        href: `/${fileName}`,
      },
    });

fileName returned from Rollup Build point to the file without specified base.

Since the path to the css file is not relative setting base html tag also not work.

Reproduction

https://github.com/thekip/qwik-css-basepath-issue

Steps to reproduce

  1. Build project some css files (the content should be a decent size, otherwise they get inlined)
  2. Run yarn serve
  3. Check that css files accessed from /build instead of /subpath/build

System Info

System:
    OS: macOS 13.3
    CPU: (10) arm64 Apple M1 Pro
    Memory: 206.59 MB / 32.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 16.17.0 - ~/.nvm/versions/node/v16.17.0/bin/node
    Yarn: 1.22.19 - ~/.nvm/versions/node/v16.17.0/bin/yarn
    npm: 8.15.0 - ~/.nvm/versions/node/v16.17.0/bin/npm
    Watchman: 2023.02.27.00 - /opt/homebrew/bin/watchman
  Browsers:
    Chrome: 111.0.5563.146
    Firefox: 95.0.2
    Safari: 16.4
  npmPackages:
    @builder.io/partytown: 0.7.6 => 0.7.6 
    undici: 5.21.0 => 5.21.0 
    vite: 4.2.1 => 4.2.1

Additional Information

No response

timofei-iatsenko avatar Apr 04 '23 10:04 timofei-iatsenko

Tied with #2462

brianbento avatar May 08 '23 13:05 brianbento

These two are related too. https://github.com/BuilderIO/qwik/issues/2462 https://github.com/BuilderIO/qwik/issues/3759

I've been making test with this errors and trying to deploy to GitHub Pages, successfully now. But I've encountered a lot of people with these same problems. I believe adding subpath would help solve a bunch of deploy problems. I'm confident enough to suggest prioritize this. 📌

cc: @adamdbradley @manucorporat

da8ah avatar May 19 '23 22:05 da8ah

Any update on this issue...

JohnPremKumar avatar Nov 25 '23 07:11 JohnPremKumar

this still doesn't work properly

chjlsch avatar Feb 29 '24 14:02 chjlsch