You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

57 lines
1.4 KiB
TypeScript

// If you don't want to use TypeScript you can delete this file!
import * as React from "react"
import { PageProps, Link, graphql, HeadFC } from "gatsby"
import Layout from "../components/layout"
import Seo from "../components/seo"
type DataProps = {
site: {
buildTime: string
}
}
const UsingTypescript: React.FC<PageProps<DataProps>> = ({
data,
location,
}) => (
<Layout>
<h1>
Gatsby supports <b>TypeScript by default</b>
</h1>
<p>
This means that you can create and write <code>.ts/.tsx</code> files for
your pages, components, and <code>gatsby-*</code> configuration files (for
example <code>gatsby-config.ts</code>).
</p>
<p>
For type checking you'll want to install <code>typescript</code> via npm
and run <code>tsc --init</code> to create a <code>tsconfig</code> file.
</p>
<p>
You're currently on the page <code>{location.pathname}</code> which was
built on {data.site.buildTime}.
</p>
<p>
To learn more, head over to our{" "}
<a href="https://www.gatsbyjs.com/docs/how-to/custom-configuration/typescript/">
documentation about TypeScript
</a>
.
</p>
<Link to="/">Go back to the homepage</Link>
</Layout>
)
export const Head: HeadFC<DataProps> = () => <Seo title="Using TypeScript" />
export default UsingTypescript
export const query = graphql`
{
site {
buildTime(formatString: "YYYY-MM-DD hh:mm a z")
}
}
`