bluwy / whyframe

Develop components in isolation with just an iframe
https://whyframe.dev
MIT License
539 stars 11 forks source link

docs/.vitepress >> custom base path & root #34

Open bx-shef opened 1 week ago

bx-shef commented 1 week ago

Hello.

Project Structure error-whyframe

The documentation is created using VitePress and is located in the /docs folder.

The project documentation will be published at https://demo.com/my-demo-folder/ In other words, the path is built relative to the '/my-demo-folder/' folder.

Config docs/.vitepress/config.mts

import {defineConfig} from 'vitepress'
import { whyframe } from '@whyframe/core'
import { whyframeVue } from '@whyframe/vue'

export default defineConfig({
  base: '/my-demo-folder/',
  vite: {
    plugins: [
      whyframe({
        defaultSrc: '/my-demo-folder/frames/default'
      }),
      whyframeVue({
        include: /\.(?:vue|md)$/
      })
    ]
  }
})

With this configuration, there is an issue error-whyframe-2

If you build the project and view it, everything works error-whyframe-3

The essence of the problem is in this code error-whyframe-fix

With this approach, it will work error-whyframe-4

bluwy commented 1 week ago

Amazing repro and description! That makes sense to me. So we need to prepend the base here:

https://github.com/bluwy/whyframe/blob/4c2f05f9841d18175163c4d19edce41414b065b7/packages/core/src/plugins/api.js#L84-L88

And I think we can borrow the base from the Vite config using the configResolved hook in the same file, where c.base exposes it. That should fix it.

Would you like to send a PR? I'm able to fix this later too if not.

bx-shef commented 1 week ago

I'm sorry, but I can't do it in the near future