Anyone have an example with Astro?

Developer Support
1

By any chance, does anyone have an example with Astro? I’m a more visual guy lol need to see code

2

Hi @resulting_crayfish,
Do you need an example for Astro React starter?

3

need example using astro builder and plasmic

4

I tried multiple ways to setup Plasmic with a basic starter of Astro project but Unfortunately, couldn’t able to do it successfully so far.
I’ve used Astro for the first time so figuring out a way to resolve the errors I got while integration.

I will leave an update for you if I get it done properly.

5

this is what I got so far

---
import { PLASMIC } from '../../plasmic-init';
import BaseLayout from "../layouts/Base.astro";

export const getStaticPaths = async () => {
  const pages = await PLASMIC.fetchPages();
  
   //return [{ params: { plasmicLoaderPage: "news" } }, { params: { plasmicLoaderPage: "about" } }];
  let pagesToRender = []
  pages.forEach((page) => {
    const path = page.path.split('/')[1]
    if(path !== "") {
      pagesToRender.push({
          params: { 
            plasmicLoaderPage: path 
          }
      })
    }
  })
  return pagesToRender;
};
---
<BaseLayout>
hello
</BaseLayout>
6

That generates the folders with the index.html

Screen Shot 2022-03-25 at 10.40.50 AM.png

7

now I need to render a plasmic page inside of BaseLayout

<BaseLayout>
hello <--- plasmic page here
</BaseLayout>
8

I got it! will do more testing