# gatsby-remark-inline-codesandbox

> 🎩 Create CodeSandbox directly from code blocks

Latest version **0.6.1** (published 2020-09-23) · MIT license · 0 weekly downloads

> **Deprecated.** This package is deprecated.

## Install

```sh
npm install gatsby-remark-inline-codesandbox
pnpm add gatsby-remark-inline-codesandbox
yarn add gatsby-remark-inline-codesandbox
bun add gatsby-remark-inline-codesandbox
```

## Health

**Score 10/100 (F)** — status: deprecated.

Negative: deprecated.

## Facts

| | |
|---|---|
| Version | 0.6.1 |
| Published | 2020-09-23 |
| First published | 2020-02-07 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 2 |
| Unpacked size | 2.9 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 283 |
| Author | Kai Hao |
| Maintainers | kevin940726 |
| Keywords | codesandbox, remark, remark-plugin, gatsby, gatsby-plugin, gatsby-remark-plugin |

## Links

- npm: https://www.npmjs.com/package/gatsby-remark-inline-codesandbox
- Repository: https://github.com/kevin940726/remark-codesandbox
- npm.io page: https://npm.io/package/gatsby-remark-inline-codesandbox

## Dependencies (2)

- [remark-codesandbox](https://npm.io/package/remark-codesandbox.md) ^0.8.1
- [to-gatsby-remark-plugin](https://npm.io/package/to-gatsby-remark-plugin.md) ^0.1.0

## Alternatives

- [@mdxeditor/editor](https://npm.io/package/@mdxeditor/editor.md) — 962.4K weekly downloads
- [mmdb-lib](https://npm.io/package/mmdb-lib.md) — 680.9K weekly downloads
- [playcanvas](https://npm.io/package/playcanvas.md) — 36.2K weekly downloads
- [@glw907/cairn-cms](https://npm.io/package/@glw907/cairn-cms.md) — 967 weekly downloads
- [markdown-to-confluence](https://npm.io/package/markdown-to-confluence.md) — 103 weekly downloads

## Recent versions

- 0.6.1 (latest) — 2020-09-23
- 0.6.0 — 2020-09-23
- 0.5.2 — 2020-02-09
- 0.5.1 — 2020-02-07

## README

# gatsby-remark-inline-codesandbox

## Installation

```bash
yarn add gatsby-remark-inline-codesandbox
```

## Setup

[`gatsby-plugin-mdx`](https://www.gatsbyjs.org/docs/mdx/plugins/#remark-plugins)

```js
module.exports = {
  plugins: [
    {
      resolve: 'gatsby-plugin-mdx',
      options: {
        gatsbyRemarkPlugins: [
          {
            resolve: 'gatsby-remark-inline-codesandbox',
            options: {
              mode: 'button',
            },
          },
        ],
      },
    },
  ],
};
```

[`gatsby-transformer-remark`](https://www.gatsbyjs.org/packages/gatsby-transformer-remark)

```js
module.exports = {
  plugins: [
    {
      resolve: 'gatsby-transformer-remark',
      options: {
        plugins: [
          {
            resolve: 'gatsby-remark-inline-codesandbox',
            options: {
              mode: 'button',
            },
          },
        ],
      },
    },
  ],
};
```

## Usage & Documentation

See the [`remark-codesandbox`](https://github.com/kevin940726/remark-codesandbox) package for more information.

---
_Source: https://npm.io/package/gatsby-remark-inline-codesandbox · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._