Using Type Script to create a modern page?

[Papageno Sweden]

I want to create an SPFx webpart that can create a modern page. I've seen code snippets creating modern pages, but it's eighter PowerShell or C# (CSOM or PnP). But I havn't seen any examples on how to use Type Script to create a modern page. Is it even possible?

[#2]

Hi @Papageno Sweden,

Yes, that's possible just by placing an anchor tag and href as below url

{webAbsoluteUrl}/_layouts/CreateSitePage.aspx

or in typescript just write the code window.open("url")

Thanks,

Jayakumar B.

[#3]

Hi, Jayakumar and thanks for your reply.

I was a bit unclear in my question, sorry.

What I mean is I need to create the page programmatically, add some information (basically a text webpart) and then save the page, thus rendering a new page in the Site Pages library.

In C# you can use AddClientSidePage, call AddControl to add webparts and finally call Save. This is all PnP stuff. I'm looking for something equivalent for TypeScript.

[#4]

Ok, I got it. A bit embarrassing, but still...

I can of course use the same PnP approach in TypeScript as in C#. I just need to be aware of the async-await concept. This is how you do it:

import pnp,{ClientSideText} from "sp-pnp-js";

protected async CreatePageAsync() {

  const page = await pnp.sp.web.addClientSidePage("my page.aspx"); 

  page.addSection().addControl(new ClientSideText("my content"));

  await page.save();

}

And then you call the function:

this.CreatePageAsync();

Found the solution here.

[#5 · Accepted solution]

Hi,

Just FYI, PnP JS-Core is deprecated in favor of the new PnPJs libraries.

You can find exactly what you're trying to do (create pages and add components) here:

https://pnp.github.io/pnpjs/sp/docs/client-side-pages/