ocavue / astrobook

Minimal Storybook alternative
https://astrobook.pages.dev
MIT License
103 stars 4 forks source link

Subpage for the stories #51

Closed marekbrze closed 1 month ago

marekbrze commented 1 month ago

Hi!

I really like your project!

It would be great to be able to add this to the existing project and generate Astrobook on the selected subpage - like "example.com/astrobook".

ocavue commented 1 month ago

Hi. You can implement this by adding base: '/astrobook' to your astro.config.mjs file. Check Astro's docs for more information.

marekbrze commented 1 month ago

@ocavue but isn't this option for the WHOLE Astro project?

I was thinking about setting path for the integration itself and deciding where it should display.

My perfect use case is:

ocavue commented 1 month ago

I see. You want to integrate astrobook into an existing astro project. Let me reopen this issue.

ocavue commented 1 month ago

astrobook@0.5.0 adds a new subpath option, which allow you to use Astrobook in an existing Astro project.

// astro.config.ts

import { defineConfig } from 'astro/config'
import astrobook from 'astrobook'

export default defineConfig({
  integrations: astrobook({ subpath: "/astrobook" })
})

When I run npm run dev I have my Astrobook shown on the /astrbook path as a help when developing components When I build the blog project the Astrobook shouldn't be generated

You can use process.env.NODE_ENV in your astro.config.ts:

// astro.config.ts

import svelte from '@astrojs/svelte'
import { defineConfig } from 'astro/config'
import astrobook from 'astrobook'

console.log('process.env.NODE_ENV', process.env.NODE_ENV)

const integrations = [svelte()]

if (process.env.NODE_ENV === 'development') {
  integrations.push(astrobook())
}

export default defineConfig({
  integrations,
})
marekbrze commented 1 month ago

@ocavue Awesome! I will test it today ❤️🙌