# gatsby-plugin-preconnect

> Gatsby plugin to add the crossorigin attribute to every tag

Latest version **1.4.0** (published 2022-12-02) · MIT license · 0 weekly downloads

## Install

```sh
npm install gatsby-plugin-preconnect
pnpm add gatsby-plugin-preconnect
yarn add gatsby-plugin-preconnect
bun add gatsby-plugin-preconnect
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.4.0 |
| Published | 2022-12-02 |
| First published | 2019-05-13 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 1 |
| Unpacked size | 1.1 MB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 10 |
| Author | NoriSte |
| Maintainers | noriste |
| Keywords | gatsby, gatsby-plugin, lighthouse, preconnect, prefetch |

## Links

- npm: https://www.npmjs.com/package/gatsby-plugin-preconnect
- Repository: https://github.com/NoriSte/gatsby-plugin-preconnect
- Homepage: https://github.com/NoriSte/gatsby-plugin-preconnect#readme
- Issues: https://github.com/NoriSte/gatsby-plugin-preconnect/issues
- npm.io page: https://npm.io/package/gatsby-plugin-preconnect

## Dependencies (1)

- [@babel/runtime](https://npm.io/package/@babel/runtime.md) ^7.4.3

## Recent versions

- 1.4.0 (latest) — 2022-12-02
- 1.3.0 — 2021-10-31
- 1.2.1 — 2021-08-01
- 1.2.0 — 2021-03-07
- 1.1.54 — 2020-06-01
- 1.1.53 — 2020-05-31
- 1.1.52 — 2020-05-30
- 1.1.51 — 2020-05-28
- 1.1.50 — 2020-05-26
- 1.1.49 — 2020-05-25
- 1.1.48 — 2020-05-22
- 1.1.47 — 2020-05-22
- 1.1.46 — 2020-05-22
- 1.1.45 — 2020-05-21
- 1.1.44 — 2020-05-20
- … 49 more at https://npm.io/package/gatsby-plugin-preconnect/versions

## README

# gatsby-plugin-preconnect

Quickly add a `<link rel="preconnect" crossorigin>` tag for every specified domain.

[![Build Status](https://travis-ci.com/NoriSte/gatsby-plugin-preconnect.svg?branch=master)](https://travis-ci.com/NoriSte/gatsby-plugin-preconnect)
[![Build Status](https://img.shields.io/badge/build%20cron-weekly-44cc11.svg)](https://travis-ci.com/NoriSte/gatsby-plugin-preconnect)
[![Renovate enabled](https://img.shields.io/badge/renovate-enabled-brightgreen.svg)](https://renovatebot.com/)
[![Commitizen friendly](https://img.shields.io/badge/commitizen-friendly-brightgreen.svg)](http://commitizen.github.io/cz-cli/)
[![semantic-release](https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg)](https://github.com/semantic-release/semantic-release)
[![Open Source
Love](https://badges.frapsoft.com/os/mit/mit.svg?v=102)](https://github.com/ellerbrock/open-source-badge/) ![npm](https://img.shields.io/npm/dw/gatsby-plugin-preconnect?color=CB3836)

## 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](https://developers.google.com/web/fundamentals/performance/resource-prioritization?utm_source=lighthouse&utm_medium=unknown#preconnect)).

## How to use

```javascript
// 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

```js
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 run `npm run plugin:link` to locally use it

## Contributors

Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)):

<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
<!-- prettier-ignore-start -->
<!-- markdownlint-disable -->
<table>
  <tr>
    <td align="center"><a href="https://twitter.com/NoriSte"><img src="https://avatars0.githubusercontent.com/u/173663?v=4" width="100px;" alt=""/><br /><sub><b>Stefano Magni</b></sub></a><br /><a href="https://github.com/NoriSte/gatsby-plugin-preconnect/commits?author=NoriSte" title="Code">💻</a> <a href="https://github.com/NoriSte/gatsby-plugin-preconnect/commits?author=NoriSte" title="Documentation">📖</a></td>
    <td align="center"><a href="https://dugagjin.lashi.engineer"><img src="https://avatars2.githubusercontent.com/u/16219574?v=4" width="100px;" alt=""/><br /><sub><b>Dugagjin Lashi</b></sub></a><br /><a href="https://github.com/NoriSte/gatsby-plugin-preconnect/commits?author=dugagjin" title="Code">💻</a> <a href="https://github.com/NoriSte/gatsby-plugin-preconnect/pulls?q=is%3Apr+reviewed-by%3Adugagjin" title="Reviewed Pull Requests">👀</a></td>
    <td align="center"><a href="http://tomorrowstudio.co"><img src="https://avatars3.githubusercontent.com/u/6374876?v=4" width="100px;" alt=""/><br /><sub><b>Sean King</b></sub></a><br /><a href="#ideas-seaneking" title="Ideas, Planning, & Feedback">🤔</a></td>
    <td align="center"><a href="http://www.schnogz.com"><img src="https://avatars0.githubusercontent.com/u/6364918?v=4" width="100px;" alt=""/><br /><sub><b>Andrew Schneider</b></sub></a><br /><a href="https://github.com/NoriSte/gatsby-plugin-preconnect/commits?author=schnogz" title="Code">💻</a> <a href="https://github.com/NoriSte/gatsby-plugin-preconnect/commits?author=schnogz" title="Documentation">📖</a> <a href="https://github.com/NoriSte/gatsby-plugin-preconnect/commits?author=schnogz" title="Tests">⚠️</a></td>
    <td align="center"><a href="https://github.com/adonig"><img src="https://avatars2.githubusercontent.com/u/900404?v=4" width="100px;" alt=""/><br /><sub><b>Andreas Donig</b></sub></a><br /><a href="#ideas-adonig" title="Ideas, Planning, & Feedback">🤔</a></td>
  </tr>
</table>

<!-- markdownlint-enable -->
<!-- prettier-ignore-end -->

<!-- ALL-CONTRIBUTORS-LIST:END -->

This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome!

---
_Source: https://npm.io/package/gatsby-plugin-preconnect · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._