gatsby-plugin-preconnect
v1.4.0
Published
Gatsby plugin to add the crossorigin attribute to every <link rel="preload"> tag
Downloads
45,231
Maintainers
Readme
gatsby-plugin-preconnect
Quickly add a <link rel="preconnect" crossorigin>
tag for every specified domain.
Install
npm install --save gatsby-plugin-preconnect
What this plugin does
It simply adds a <link rel="preconnect" href="https://example.com" crossorigin>
to the page (see the
Resource Prioritization - Preconnect
guide).
How to use
// In your gatsby-config.js
plugins: [
{
resolve: 'gatsby-plugin-preconnect',
options: {
domains: ['https://foo.com', 'https://bar.com'],
},
},
]
crossOrigin
is set to true
by default but it can be customized, below all the available options
plugins: [
{
resolve: 'gatsby-plugin-preconnect',
options: {
domains: [
'https://foo.com',
'https://bar.com',
{ domain: 'https://enablecors.com', crossOrigin: true },
{ domain: 'https://disablecors.com', crossOrigin: false },
{ domain: 'https://corswithanonymous.com', crossOrigin: 'anonymous' },
{ domain: 'https://corswithcreds.com', crossOrigin: 'use-credentials' },
],
},
},
]
All the available values for crossOrigin
are listed below, every other value makes the plugin throw an error
| Value | Equivalent value |
| ------------------- | --------------------- |
| undefined
| "anonymous" |
| true
| "anonymous" |
| "anonymous"
| "anonymous" |
| "use-credentials"
| "use-credentials" |
| false
| (attribute not added) |
Contributing
PR or issues are welcome 👋
Notes
- if you want to work on the plugin sources, remember that you need to
npm run build
on the root then, in every test project, you need to runnpm run plugin:link
to locally use it
Contributors
Thanks goes to these wonderful people (emoji key):
This project follows the all-contributors specification. Contributions of any kind welcome!