Change compilation directory

[dusty root]

Hi, I am using astrojs and I wanted to see if it was possible to change the compilation directory for each file, for example I have in my src/pages/blog/index.astro and when I compile it generates blog.html in the root of dist but not inside the blog/... as in my development structure, I was trying with vitejs to achieve this and I get an error :

[vite:load-fallback] Could not load @astro-page:src/pages/internship@_@astro: The argument 'path' must be a string or Uint8Array without null bytes. Received '\x00@astro-page:src/pages/internship@_@astro'
 error   Could not load @astro-page:src/pages/internship@_@astro: The argument 'path' must be a string or Uint8Array without null bytes. Received '\x00@astro-page:src/pages/internship@_@astro'

this is my astro.config

import {defineConfig} from 'astro/config';
import sitemap from "@astrojs/sitemap";
import {fileURLToPath} from 'url';
import mdx from "@astrojs/mdx";
import * as path from "path";

const __filename = fileURLToPath(import.meta.url);
const __dirname = path.dirname(__filename);

// https://astro.build/config
export default defineConfig({
  //trailingSlash: 'never',
  integrations: [sitemap(), mdx({
    syntaxHighlight: 'shiki',
    shikiConfig: {theme: 'dracula'},
  })],
  build: {
    format: 'file',
    assets: 'assets'
  },
  vite: {
    root: path.resolve(__dirname, './src'),
    build: {
      rollupOptions: {
        input: {
          //Html entries
          home: path.resolve(__dirname, "./src/pages/index.astro")
        }
      }
    }
  }
});

Someone with experience in astro and vitejs can give me a hand? I would appreciate it 🙂

[uncut otter]

sorry what exactly are you expecting? not clear

if im guessing correctly, check this issue https://github.com/withastro/astro/issues/6947#issuecomment-1542729324

[dusty root]

this is my developing structure:
https://ibb.co/G29JJk6
and this is what compiles me, I wanted to know if with vite it was possible to change the path because the blog.html is leaving it in the root of the dist folder, and it should be dist/blog/index.html.

https://ibb.co/McZZsR8

[dusty root]

I will check it out

[uncut otter]

that's definitely weird, even the examples produce a blog/index.html on build

is your collections defined?

[dusty root]

i'm using format: 'file', on my config

not directory

[uncut otter]

can you share your config?

fwiw templates from astro site https://ibb.co/LtCySbg

[dusty root]

this is my config

[uncut otter]

ah whoops forgot it let me check

yeah i guess the build: file is causing issues

without it, blog/index.html is being produced

[dusty root]

with directory compiles me about/index.html blog/index.html etc, but to avoid breaking the seo already established I changed it to 'file', but now in blog it is leaving it outside its folder as blog.html when it should be blog/index.html and so on for dynamic pages

[uncut otter]

well then you'll have to manually move blog.html inside blog and rename to index.html

check that github issue i shared

you can probably adapt it to write your own to move only blog

you can also probably just have it as a bash script

mv dist/blog.html dist/blog/index.html

[dusty root]

and there is no way to do it with vite?

I have been trying but I get the error you see above.

[uncut otter]

dont think so

[dusty root]

How can I do the bash script?

[uncut otter]

are you on linux/mac or windows?

[dusty root]

windows

[uncut otter]

hmm not sure then, running this after build should work on linux/mac

[dusty root]

can it be run every time the build is done?

[uncut otter]

yeh have an npm script which is called after build

[dusty root]

Could you share an example pls?

[uncut otter]

ah there are problems, the open graph urls would still point to '/blog.html'

but this ```js
import { defineConfig } from 'astro/config';
import mdx from '@astrojs/mdx';
import path from 'path';
import sitemap from '@astrojs/sitemap';

const blogCopyInteg = () => {
return {
name: 'blogCopyIntegration',
hooks: {
'astro:build:done': ({ dir }) => {
const distPath = dir.pathname;
const sourceFile = distPath + 'blog.html';
const targetFile = distPath + 'blog/index.html';
console.log({ sourceFile, targetFile });
if (fs.existsSync(sourceFile)) {
// Create the target directory if it doesn't exist
const targetDirectory = path.dirname(targetFile);
if (!fs.existsSync(targetDirectory)) {
fs.mkdirSync(targetDirectory, { recursive: true });
}

      // Move the file
      fs.rename(sourceFile, targetFile, (err) => {
        if (err) {
          console.error(`Error moving the file: ${err}`);
        } else {
          console.log('File moved successfully.');
        }
      });
    } else {
      console.error('Source file does not exist.');
    }
  },
},

};
};

// https://astro.build/config
export default defineConfig({
site: 'https://example.com',
integrations: [mdx(), sitemap(), blogCopyInteg()],
build: {
assets: 'assets',
format: 'file',
},
});

https://stackblitz.com/edit/github-tbog1k?file=astro.config.mjs