Я использую Docusaurus и хотел бы открывать внешние ссылки в новых вкладках.
Я бы предпочел использовать для этого код, а не писать html-код в моем документе уценки в соответствии с этот ответ.
Я пробовал этот ответ:
[link](url){:target = "_blank"}
А также этот ответ:
[Google](https://google.com" target = "_blank)
Я думаю, что эта почта, вероятно, сделает то, что я хочу, я пытался добавить код в _index.js, но Docusaurus прекратил сборку.
(function() {
var links = document.getElementsByTagName('a');
for (var i = 0; i < links.length; i++) {
if (/^(https?:)?///.test(links[i].getAttribute('href'))) {
links[i].target = '_blank';
}
}
})();
Я загрузил код JavaScript в Гитхаб и добавил его в siteConfig.js:
// Add custom scripts here that would be placed in <script> tags.
scripts: [
"https://buttons.github.io/buttons.js",
"https://msdcanderson.github.io/docusaurus-open-link-new-tab.github.io/open-link-new-tab.js"
],
Скрипт загружается, но не работает должным образом.
Я ожидаю, что ссылка, написанная в Markdown, откроется в новой вкладке браузера:
[the rmarkdown website](https://rmarkdown.rstudio.com)
Любые идеи были бы замечательными - спасибо
🤔 А знаете ли вы, что...
JavaScript позволяет создавать мобильные приложения для iOS и Android с использованием фреймворков, таких как React Native и NativeScript.
Сопровождающий докузавр здесь!
Вы правы, что Docusaurus не поддерживает это из коробки. Вероятная причина того, что ваш вышеприведенный скрипт не работает, заключается в том, что Docusaurus вводит теги <script> над <body>, и когда скрипт запускается, <body> не загружается и нет тегов <a> для работы. Попробуйте обернуть свой код в document.addEventListener('DOMContentLoaded', ...) следующим образом:
document.addEventListener('DOMContentLoaded', function() {
var links = document.getElementsByTagName('a');
for (var i = 0; i < links.length; i++) {
if (/^(https?:)?///.test(links[i].getAttribute('href'))) {
links[i].target = '_blank';
}
}
});
Однако я рекомендую вам не использовать этот сценарий, а вместо этого добиться эффекта несколькими другими способами:
Настройте это с помощью замечательных плагинов. Замечательным является механизм Markdown, который преобразует Markdown в HTML.
Этот замечательный-extlink плагин кажется тем, что вам нужно. Попробуйте добавить его в свой siteConfig! См. документацию siteConfig здесь.
// siteConfig.js
const extlink = require('remarkable-extlink');
const siteConfig = {
...
markdownPlugins: [
function(md) {
extlink(md, {
host: 'yourhost.com', // The hrefs that you DON'T want to be external
});
},
],
...
}
Remarkable поддерживает создание внешних ссылок путем настройки linkTarget вариант, а Docusaurus показывает это в siteConfig (но не задокументировано) и в данный момент не работает. Я отправил пиар, чтобы исправить это, так что следите за этим в следующем выпуске. Однако я бы не рекомендовал этот подход, поскольку он делает Все ваши ссылки открытыми в новой вкладке, а не только внешние.
Лично я бы просто использовал этот вариант, так как он самый быстрый. Кроме того, в этом нет ничего плохого/плохого, и мне нравится, что я могу использовать HTML.
Напишите свой собственный плагин, который понимает такой синтаксис [link](url){:target = "_blank"} и генерирует нужный HTML. Это может быть лучшим вариантом, если вы не хотите использовать HTML, но требует больших усилий.