windicss-analysis icon indicating copy to clipboard operation
windicss-analysis copied to clipboard

Custom base path for generated preview website

Open arpadgabor opened this issue 3 years ago • 2 comments

Context

I have a Nuxt project and I want to deploy the analyzer report in the same dist folder with the static generated output of Nuxt, in short, as a sub-page of my website.

Basically, I'm running nuxt generate && windicss-analysis --html dist/styles and everything is exported fine, however, the linked resources all start with a leading / so when the browser tries to load them all result in a 404 since they are not in the root folder (i.e. they are in /styles/* instead of /*).

Possible solutions

  1. Try and remove the leading / from imported resources (it seems like Storybook does this)
  2. Add another flag when exporting to specify a base path, e.g. --base-path

arpadgabor avatar May 20 '21 18:05 arpadgabor

Yeah, good point. Vite already handles that and all we need to do is add another cli option --base and pass it to the Vite's config. https://vitejs.dev/config/#base

PR welcome. Thanks!

antfu avatar May 20 '21 20:05 antfu

I would've submitted a PR but looking through the code I'm not sure I get how the build phase works. It looks like the package when installed is already built by vite, right? How should that option be implemented if the --html script just copies the already built package and adds the generated output?

https://github.com/windicss/windicss-analysis/blob/0622ec5a9321d7d7e6cb4fe5f83aee46b7256514/node/build.ts#L30

arpadgabor avatar May 21 '21 09:05 arpadgabor