Static Site Generation (SSG) does not generate "dist/index.html"

[ThomasPDM]

Hello, thank you for all your work. I am trying to generate a static website but on "npm run build", the dist directory is generated but without "index.html". I tried again outside of my project, by pulling the qwik-speak repository and using SSG, however, this is not working. The steps as follow:

Setup qwik-speak repository:

git clone https://github.com/robisim74/qwik-speak.git

cd qwik-speak

npm install

Set SSG adapter:

npm run qwik add

Update speak-functions.ts by adding:

/**
 * Dynamic SSG route
 */
export const onStaticGenerate: StaticGenerateHandler = () => {
  return {
    params: config.supportedLocales.map(locale => {
      return { lang: locale.lang !== config.defaultLocale.lang ? locale.lang : '' };
    })
  };
};

Build:

npm run build

Maybe I miss understood something on https://robisim74.gitbook.io/qwik-speak/library/adapters. Those files are generated in "dist": "favicon.svg _headers manifest.json q-manifest.json robots.txt service-worker.js". Also "dist/build" folder contains "en-US" and "it-IT" folders surrounded by a lot of js files.

How to properly use SSG using qwik-speak?

[robisim74]

Please read the documentation carefully:

https://qwik.builder.io/docs/guides/static-site-generation/#dynamic-ssg-routes
https://robisim74.gitbook.io/qwik-speak/library/adapters#static-site-generation-ssg

The sample app in Qwik Speak has an optional parameter lang in url, so it uses dynamic SSG routes: you have to put onStaticGenerate in every page, and not in speak-functions.ts, because you need to generate an index.html for every page and for every language.

So the steps to adapt the sample app are the following:

1. npm run qwik add (Adapter: Static site (.html files)

2. Update src\routes\[...lang]\index.tsx:

export const onStaticGenerate: StaticGenerateHandler = () => {
  return {
    params: config.supportedLocales.map(locale => {
      return { lang: locale.lang !== config.defaultLocale.lang ? locale.lang : '' };
    })
  };
};

3. Update src\routes\[...lang]\page\index.tsx:

export const onStaticGenerate: StaticGenerateHandler = () => {
  return {
    params: config.supportedLocales.map(locale => {
      return { lang: locale.lang !== config.defaultLocale.lang ? locale.lang : '.' }; // the dot is a workaround for default lang
    })
  };
};

4. Update src\components\header\header.tsx from Link to tag a (SPA mode makes no sense with SSG)

          <li>
            <a href={getHref('/')}
              class={{ active: pathname === '/' || config.supportedLocales.some(x => pathname.endsWith(`${x.lang}/`)) }}>
              {t('app.nav.home')}
            </a>
          </li>
          <li>
            <a href={getHref('/page')}
              class={{ active: pathname.endsWith('/page/') }}>
              {t('app.nav.page')}
            </a>
          </li>

5. npm run build and inspect dist folder: you should have 4 index.html, 2 for default lang en-US (with no param in url) and 2 for it-IT:
   

6. cd dist and npx http-server

[ThomasPDM]

My bad, thank you.