Skip to content
Plugin to add Ant Design to Gatsby
Branch: master
Clone or download
Type Name Latest commit message Commit time
Failed to load latest commit information.
.github/ISSUE_TEMPLATE Update issue templates Oct 4, 2018
src Update gatsby-node.js Aug 30, 2018
.babelrc Create .babelrc Aug 3, 2017
.gitignore chore: chg git ignore file Sep 26, 2018
.npmignore Create .npmignore Aug 3, 2017 Create Oct 4, 2018
LICENSE Create LICENSE Oct 4, 2018 Update Sep 18, 2018
index.js Create index.js Aug 3, 2017
package.json update babel Sep 18, 2018

npm package


Use Ant Design with Gatsby


npm install antd gatsby-plugin-antd --save

for v1

npm install antd gatsby-plugin-antd^1.0.0 --save

How to use

  1. Include the plugin in your gatsby-config.js file.
// in gatsby-config.js
plugins: [
// or if you want to use less
plugins: [
      resolve: 'gatsby-plugin-antd',
      options: {
        style: true

note: if you are using less then you need to install less

  1. In your component(s) include the Ant Design component using dynamic imports as suggested here
// in your component
import { Button } from 'antd'

export default () => <Button type="primary">Primary</Button>
  1. It will pull in the component and the relevant css file using babel-plugin-import
You can’t perform that action at this time.