How to place astro-paper in a subdirectory of the website

[johanazhu]

Hello, I have a confusion. After I deploy astro-paper to vercel, I want to put the website under xxx.com/blog. When I set it in next.config.js of xxx.com

 async rewrites() {
    return [
      {
        source: '/blog/:subdir*',
        destination: 'http://xxx.com/:subdir*',
      },
      {
        source: '/(.*)',
        destination: '/',
      },
    ];
  },

Style and css error reporting, click on the article, there is no prefix (/blog)

PS：I am a Chinese and my English is not very good.

[benjaminrae]

Have you considered using a subdomain? That would make it https://blog.xxx.com. I see that pattern a lot more and I think it will be much easier to configure

[satnaing]

Hello @johanazhu
I might be a little too late. However, here's the solution I can think of.

1. Add a base and trailingSlash in astro.config.ts

export default defineConfig({
  // others
  base: "/blog",
  trailingSlash: "ignore",
  // others
)}

2. Then, update all the links to include /blog/ or import.meta.env.BASE_URL at the start.

<a href=`/blog/posts/`>Posts</a>
<link rel="icon" type="image/svg+xml" href="/blog/favicon.svg" />
<script is:inline src=`${import.meta.env.BASE_URL}/toggle-theme.js`></script>

[JeS24]

I have implemented a base URL in my fork that we use at our lab. It basically follows @satnaing's suggestion above. You can take a look here: https://github.com/JeS24/smlab-talks.

P.S.: There are some other changes that were needed in our case. Feel free to ignore those.