gatsby-plugin-template

Load code with template, indent is preserved, only support Gatsby v2

Install

npm install --save gatsby-plugin-template

How to use

In your gatsby-config.js

module.exports = {
  plugins: [
    {
      resolve: 'gatsby-plugin-template',
      options: {
        test: /\/src\/examples\/(?!index).*\.jsx?$/,
        template: `${__dirname}/example-template.js`,
        placeholder: '/*** placeholder ***/',
      },
    },
  ],
}

Options

• test (regexp) - required, regexp identifies which files should be transformed.
• template (string) - required, absolute path of the template file.
• placeholder (string) - placeholder to be replaced, defaults to /*** placeholder ***/.
• exportResult (string | boolean) - export the transformed content as provided name, defautls to false.
• exportRaw (string | boolean) - export the raw content as provided name, defautls to false.

Example

1. template

import React from 'react'
import styled, { css } from 'styled-components'
 
/*** placeholder ***/

1. code

const Button = styled.button`
  border-radius: 3px;
  padding: 0.25em 1em;
  margin: 0 1em;
  background: transparent;
  color: palevioletred;
  border: 2px solid palevioletred;
`;
 
export default Button
`

1. transformed

import React from 'react'
import styled, { css } from 'styled-components'
 
const Button = styled.button`
  border-radius: 3px;
  padding: 0.25em 1em;
  margin: 0 1em;
  background: transparent;
  color: palevioletred;
  border: 2px solid palevioletred;
`
 
export default Button