Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Added global config for external links #357

Closed
wants to merge 2 commits into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 7 additions & 0 deletions docs/config/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -127,6 +127,13 @@ Provide config options to the used theme. The options will vary depending on the

## Markdown


### markdown.link
- Type: `Object`
- Default: `{ blank: true }`

Setting `markdown.link.blank` to `false` will cause all external links to open in the same window.

### markdown.slugify

- Type: `Function`
Expand Down
4 changes: 3 additions & 1 deletion docs/guide/markdown.md
Original file line number Diff line number Diff line change
Expand Up @@ -48,11 +48,13 @@ Given the following directory structure:

### External Links

Outbound links automatically gets `target="_blank"`:
Outbound links automatically gets `target="_blank" rel="noopener noreferrer"`:
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

rel="noopener noreferrer" should be remained here.


- [vuejs.org](https://vuejs.org)
- [VuePress on GitHub](https://github.com/vuejs/vuepress)

You could alter this this behavior by setting `config.markdown.link.blank = false`. See more [here](/config/#markdown-link).

## Front Matter

[YAML front matter](https://jekyllrb.com/docs/frontmatter/) is supported out of the box:
Expand Down
4 changes: 3 additions & 1 deletion lib/markdown/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,9 @@ module.exports = ({ markdown = {}} = {}) => {
// custom plugins
.use(component)
.use(highlightLines)
.use(convertRouterLink)
.use(convertRouterLink, Object.assign({
blank: true
}, markdown.link))
.use(hoistScriptStyle)
.use(containers)

Expand Down
11 changes: 7 additions & 4 deletions lib/markdown/link.js
Original file line number Diff line number Diff line change
@@ -1,8 +1,9 @@
// markdown-it plugin for:
// 1. adding target="_blank" to external links
// 1. adding target="_blank" and rel="noopener noreferrer" to external links
// (if opts.blank is true)
// 2. converting internal links to <router-link>

module.exports = md => {
module.exports = (md, opts) => {
let hasOpenRouterLink = false

md.renderer.rules.link_open = (tokens, idx, options, env, self) => {
Expand All @@ -14,8 +15,10 @@ module.exports = md => {
const isExternal = /^https?:/.test(href)
const isSourceLink = /(\/|\.md|\.html)(#.*)?$/.test(href)
if (isExternal) {
addAttr(token, 'target', '_blank')
addAttr(token, 'rel', 'noopener noreferrer')
if (opts.blank) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

blank should only control the target, and noopener and noreferrer are both worth to be added to external links by default.

See: Opens External Anchors Using rel="noopener"

Adding a rel="noopener" attribute prevents the new page from being able to access the window.opener property and will ensure it runs in a separate process. The rel="noreferrer" attribute has the same effect, but will also prevent the Referer header from being sent to the new page. See HTML Standard: Link type "noreferrer" for an explanation of this behavior.

Also see: The performance benefits of rel=noopener

If you have links to another origin, you should use rel="noopener".

addAttr(token, 'target', '_blank')
addAttr(token, 'rel', 'noopener noreferrer')
}
} else if (isSourceLink) {
hasOpenRouterLink = true
tokens[idx] = toRouterLink(token, link)
Expand Down