Snowpack multi-page application with svelte and tailwindcsss

Question

I was able to partially setup the rollup + svelte + tailwind + multi-page , but its slow and debugging is difficult.

though there is svelte + snowpack + tailwindcss is there here https://github.com/agneym/svelte-tailwind-snowpack

but multi-page snowpack is what i cannot figure out. I cannot even find any documentation for multi-page snowpack setup.

Can anyone help me in figuring out how to setup Snowpack + Svelte + multi-page + Tailwind-css ?

Answer 1

snowpack.config.mjs:

export default {
  mount: {
    public: "/",
    src: "/dist"
  },
...

So, all file in src will compile to dist.

In /src, setup an other page.js exactly like the index.js(if you like, you can only change the import path).

The Page.svelte imported in page.js will serve as another route aside from index.

In /public:

Pay attention to the <script> tag in index.html: <script type="module" src="/dist/index.js"></script>

Now, create another /public/page.html, but use the new page.js: <script type="module" src="/dist/page.js"></script>

And, that it. You have a new page route.