1import React from 'react' 2import {graphql} from 'gatsby' 3import styled from 'styled-components' 4import FoundTypo from 'src/components/FoundTypo' 5import Scripts from 'src/components/scripts' 6const version = require('../../../package.json').version 7 8const Content = styled.div` 9 max-width: 760px; 10 margin: auto; 11 padding: 0 30px 120px; 12` 13 14const Page = ({data}) => { 15 const pageData = data.markdownRemark 16 const html = pageData.html.replace(/@VERSION@/g, version) 17 .replace(/(npm-)+([a-zA-Z\\.-]*)(\((1|5|7)\))<\/h1>/, 'npm $2</h1>') 18 .replace(/([a-zA-Z\\.-]*)(\((1|5|7)\))<\/h1>/, '$1</h1>') 19 20 return ( 21 <Content className='documentation'> 22 <div dangerouslySetInnerHTML={{ __html: html }} /> 23 <FoundTypo /> 24 <Scripts /> 25 </Content> 26 ) 27} 28 29export default Page 30 31export const query = graphql` 32 query($slug: String!) { 33 markdownRemark(fields: { slug: { eq: $slug } }) { 34 html 35 fields { 36 slug 37 } 38 } 39 } 40` 41