Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/webistomin/posthtml-link-noreferrer
:lock: PostHTML plugin to make secure links
https://github.com/webistomin/posthtml-link-noreferrer
link nofollow noopener noreferrer post-processing posthtml-link-noreferrer
Last synced: 18 days ago
JSON representation
:lock: PostHTML plugin to make secure links
- Host: GitHub
- URL: https://github.com/webistomin/posthtml-link-noreferrer
- Owner: webistomin
- License: mit
- Created: 2019-05-07T16:32:58.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2023-01-07T07:33:34.000Z (almost 2 years ago)
- Last Synced: 2024-10-04T17:42:23.649Z (about 2 months ago)
- Topics: link, nofollow, noopener, noreferrer, post-processing, posthtml-link-noreferrer
- Language: JavaScript
- Homepage: https://mathiasbynens.github.io/rel-noopener/
- Size: 1.03 MB
- Stars: 9
- Watchers: 2
- Forks: 0
- Open Issues: 12
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: CONTRIBUTING.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
README
# posthtml-link-noreferrer 
[![NPM][npm]][npm-url]
[![Deps][deps]][deps-url]
[![DevDeps][dev-deps]][dev-deps-url]
[![Build][build]][build-badge]
This plugin add `rel="noopener"` and `rel="noreferrer"` to all links that contain the attribute `target="_blank"`.
Read more about problem in [google blog](https://developers.google.com/web/tools/lighthouse/audits/noopener).
**⭐️ Star me on GitHub — it helps!**
**Before:**
``` html
External link
External link
Home
```
**After:**
``` html
External link
External link
Home
```
## Demo
[**DEMO**](https://mathiasbynens.github.io/rel-noopener/)
## Install
```npm
npm i posthtml-link-noreferrer --save-dev
```
## Usage
### Gulp
```npm
npm i gulp-posthtml posthtml-link-noreferrer --save-dev
```
```js
const gulp = require('gulp');
const postHTML = require('gulp-posthtml');
const postHTMLNoRef = require('posthtml-link-noreferrer');
const config = () => ({
plugins: [
postHTMLNoRef({
attr: ['noopener', 'noreferrer']
}),
],
});
gulp.task('posthtml', () => gulp.src('./build/*.html')
.pipe(postHTML(config))
.pipe(gulp.dest('./build')));
```
### Webpack
```npm
npm i html-loader posthtml-loader posthtml-link-noreferrer --save-dev
```
```js
module: {
rules: [
{
test: /\.html$/,
use: [
'html-loader',
{
loader: 'posthtml-loader',
options: {
plugins: [
require('posthtml-link-noreferrer')({
attr: ['noopener', 'noreferrer']
})
]
}
}
]
}
]
}
```
## Options
| Option | Type | description | Possible subsets | Default value |
| ------ | ------ | ------ | ------ | ------ |
attr | `array` | Describes rel attributes. | `'noopener'`, `'noreferrer'`, `'nofollow'` | `'noopener', 'noreferrer'` |
---
### Contributing
See [PostHTML Guidelines](https://github.com/posthtml/posthtml/tree/master/docs) and [contribution guide](CONTRIBUTING.md).
### License [MIT](LICENSE)
[npm]: https://img.shields.io/npm/v/posthtml-link-noreferrer.svg
[npm-url]: https://npmjs.com/package/posthtml-link-noreferrer
[deps]: https://david-dm.org/posthtml/posthtml.svg
[deps-url]: https://david-dm.org/webistomin/posthtml-link-noreferrer
[dev-deps]: https://david-dm.org/webistomin/posthtml-link-noreferrer/dev-status.svg
[dev-deps-url]: https://david-dm.org/webistomin/posthtml-link-noreferrer?type=dev
[style]: https://img.shields.io/badge/code%20style-standard-yellow.svg
[style-url]: http://standardjs.com/
[build]: https://github.com/webistomin/posthtml-link-noreferrer/actions/workflows/ci.yml/badge.svg
[build-badge]: https://github.com/webistomin/posthtml-link-noreferrer/actions/workflows/ci.yml