@studiocms/devapps

Introduction

A Collection of useful tools available during dev mode in Astro.

Installation

Astro Method

1. Install the package and add to your astro config using the following command:

   npm

   npx astro add @studiocms/devapps

   pnpm

   pnpm astro add @studiocms/devapps

   yarn

   yarn astro add @studiocms/devapps

2. Update your config file as shown under Example Config below.

Manual Method

1. Install the package using the following command:

   npm

   npm i @studiocms/devapps

   pnpm

   pnpm add @studiocms/devapps

   yarn

   yarn add @studiocms/devapps

2. Add @studiocms/devapps to your astro config file:

   astro.config.mjs

   import { defineConfig } from 'astro/config';
   import studiocms from 'studiocms';
   import devApps from '@studiocms/devapps';
   
   export default defineConfig({
      site: "https://example.com",
      integrations: [
          studiocms(), // REQUIRED
          devApps(),
      ],
   });

Usage

All tools will only be available during astro dev and will not be available during production deployments!

Example config

astro.config.mjs

import { defineConfig } from 'astro/config';
import studiocms from 'studiocms';
import devApps from '@studiocms/devapps';

export default defineConfig({
  site: "https://example.com",
  integrations: [
    studiocms(), // REQUIRED
    devApps(/* See Config Options Below */),
  ],
});

Config Options

Full list of options available for the devApps integration, with default values shown. All options are optional.

import devApps from '@studiocms/devapps';
devApps({
// ---cut---
endpoint: '_studiocms-devapps',
verbose: false,
appsConfig: {
  wpImporter: true,
},
// ---cut-after---
})

Tools

Wordpress Importer

Development tool to import WordPress posts and pages into the StudioCMS database.

Requirements

• StudioCMS Integration
• WordPress Install
• @studiocms/blog (Optional: for importing Posts under a blog)

Preview Usage

• Toolbar app