Gatsby-plugin-typography NPM

gatsby-plugin-typography

A Gatsby plugin for utilizing the Typography library with minimal configuration.

Install

npm install gatsby-plugin-typography react-typography typography

Why to use

A typical typography.js file utilizing one of its themes might look like this:

import Typography from "typography"
import grandViewTheme from "typography-theme-grand-view"

const typography = new Typography(grandViewTheme)

// Export helper functions
export const { scale, rhythm, options } = typography
export default typography

You then have to take the exported stylesheets and inline them in your entry file. Since a theme comes with two fonts, you also have to make sure you have the fonts available somehow.

By using gatsby-plugin-typography and specifying the path to your typography.js file via the pathToConfigModule option (see below), the inclusion of your typography styles and any relevant fonts is taken care of by a pair of helper methods under the hood, keeping your typography-related config in a single location and your entry file sparse.

How to use

// In your gatsby-config.js
module.exports = {
  plugins: [
    {
      resolve: `gatsby-plugin-typography`,
      options: {
        pathToConfigModule: `src/utils/typography`,
      },
    },
  ],
}

Options

pathToConfigModule: (string) The path to the file in which you export your typography configuration.
omitGoogleFont: (boolean, default: false) Typography includes a helper that makes a request to Google's font CDN for the fonts you need. You might, however, want to inject the fonts into JS or use a CDN of your choosing. Setting this value to true will make gatsby-plugin-typography skip the inclusion of this helper. You will have to include the appropriate fonts yourself.

gatsby gatsby-plugin typography typography.js

@babel/runtime

@studiobear/gatsby-theme-ionic @studiobear/gatsby-theme-blog gatsby-theme-contactless-menu gatsby-theme-bejamas-core test-theme-shawacademy @hesburgh-wse/gatsby-theme-marble @pojntfx-incubator/gatsby-tutorial-4 @everything-registry/sub-chunk-1722 sy7-blog visual-docs @dschau/gatsby-theme-blog @dschau/gatsby-theme-workshop @codeanit.com/theme @benjaminscholtens/gatsby-theme-fluid @dfds-frontend/gatsby-theme surveyless try-gatsby @christiandavid/gatsby-theme-byfolio 1kohei1 10secondsofcode-custom @adamquadmon/gatsby-theme-lucifero @confluenza/gatsby-theme-confluenza @dumppi/gatsby-theme-dumppi @greatgatsbyjs/gatsby-theme-ggt-material-ui-blog @howtographql/gatsby-theme @hummingbird/gatsby-theme @gatsbyjs/gatsby-theme-website @getecho/gatsby-theme-echo @kumarvaralakshmi/gatsby-theme-ghost @kyrelldixon/gatsby-theme-wpgraphql-tabor @lucasterra7/gatsby-theme-docs @eggheadio/gatsby-theme-egghead-blog @mnemonicorg/gatsby-theme-archive-site @jampile/gatsby-theme-conference @kjack/gatsby-theme-archive-site @novvum/base-theme react-holiday graphql-blog igor-portfolio-gatsby hive-honeycomb mberneti react-virtuoso-site @wingscms/hummingbird @victoriabernard92/docs-theme @zalastax/nolb-gatsby-plugin-t @zairon87/gatsby-theme-pixafy cf-gatsby-theme cf-gatsby-theme-new daudr-blog bart-van-der-waerden gatsby-theme-alice gatsby-theme-admin-dashboard gatsby-theme-blog-ghost-casper gatsby-theme-bulma-core gatsby-theme-banshorian gatsby-theme-blog-typography gatsby-theme-consumer-site gatsby-theme-cloudflare-docs gatsby-hello-world-blog gatsby-docs-starter gatsby-opinionated-starter gatsby-markbook gatsby-asphalt-theme gatsby-theme-90s gatsby-theme-dashbored gatsby-theme-dev-blog gatsby-theme-espt gatsby-theme-docs-system gatsby-starter-blog gatsby-theme-minsbi gatsby-theme-monomer gatsby-theme-pawan-blog gatsby-theme-podcast gatsby-theme-prismic-starter gatsby-theme-sales-site gatsby-theme-sylius gatsby-theme-jamfire-conference gatsby-theme-maximeheckel gatsby-theme-mbois gatsby-theme-mboisbos gatsby-theme-gutenberg gatsby-theme-luchoster-base gatsby-theme-gatsbyjs-website gatsby-theme-ghost-casper gatsby-theme-jules gatsby-theme-graphcms-blog gatsby-theme-uyee gatsbyjs-theme

7 months ago

7 months ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

3 years ago

5.0.0-alpha-drupal-proxyurl.14

3 years ago

3 years ago

3 years ago

2 years ago

3 years ago

5.0.0-alpha-v5.d20221005t111511.35

3 years ago

5.2.0

3 years ago

5.3.0-next.0

3 years ago

5.3.0

3 years ago

5.0.0-alpha-v5.d20221012t101120.57

3 years ago

5.0.0-alpha-v5.d20221010t183635.51

3 years ago

5.0.0-alpha-v5.d20221007t081809.41

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

2 years ago

4.14.0-alpha-transformer-json.26

3 years ago

4.23.0-alpha-v5.26

3 years ago

4.24.0

3 years ago

5.0.0-alpha-v5.16

3 years ago

4.23.0-alpha-preview-gh-api.26

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

4.23.0-alpha-9689ff.25

3 years ago

4.23.0-next.0

3 years ago

4.23.0-alpha-a5-peer.70

3 years ago

4.23.0

3 years ago

4.23.0-alpha-a5-peer.69

3 years ago

4.22.0

3 years ago

4.25.0-next.0

3 years ago

4.21.0-next.0

3 years ago

4.15.0-alpha-wp-image-cdn-auth.48

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

4.18.0-alpha-drupal-self-reference.18

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

4.8.0-alpha-image-service.25

3 years ago

4.8.0-alpha-image-service.24

3 years ago

4.7.0

3 years ago

4.6.0-alpha-ts-jit.60

3 years ago

4.7.0-next.0

3 years ago

4.6.0

3 years ago

4.7.0-alpha-image-service.75

3 years ago

4 years ago

3 years ago

3 years ago

3 years ago

4 years ago

3 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

3.14.0-alpha-qe-sm.46

4 years ago

4.0.0-alpha-9689ff.13

4 years ago

4.0.0-alpha-9689ff.36

4 years ago

4.0.0-alpha-9689ff.34

4 years ago

4.0.0-alpha-9689ff.8

4 years ago

4.0.0-alpha-9689ff.24

4 years ago

4.0.0-alpha-9689ff.22

4 years ago

4.0.0-alpha-9689ff.17

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4.0.0-alpha-9689ff.27

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

5 years ago

5 years ago

5 years ago

2.7.0-image-helpers.58

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

2.4.3-unifiedroutes.76

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago