So, here comes the plan:

• Export posts to XML
• Convert XML to markdown
• Support for images
• Angular goodies
• Deployment

Export posts

The first thing you have to do is to export all your posts from WordPress. Luckily for us WordPress has a functionality to export all your posts into XML. You can find this option in your WP Admin navigation:

For more details check WordPress official documentation - Tools Export Screen.

After this operation you have your XML file, but it’s still XML and you would like to have MarkDown format.

XML to MD

As a way to convert XML into MD within keeping blog format we can use wordpress-export-to-markdown tool:

Answer prompt questions carefully because it’s better to keep the same structure of URLs.

Conversion finished? Well done! Now you have you md files with images. Doesn’t Scully support images within md?

Blog images and Scully

Bad news for you. Scully does not know what to do with images, it skips them for conversion, but still it doesn’t copy them in the right directory together with compiled HTML.

Good news - Scully has a plugin system. If you want to know how to write Scully plugins please check this article by Sam Vloeberghs, it’s great!

Scully plugin to copy images

We want Scully to copy images from source of md files to compiled html files. For that to happen, we will create a small image plugin(image.scully.plugin.ts):‌

export function imageFilePlugin(raw: string, route: HandledRoute) {
  return new Promise((resolve) => {
    fs.copyFile(route.templateFile, './dist/static/images/' + route.data.sourceFile, (err) => resolve(''));
  });
}
<>

There is yet neither ./dist/static directory, nor ./dist/static/images, so you need to create them before copying:

#angular #scully #wordpress #xml #images