mirror of
https://github.com/facebook/docusaurus.git
synced 2025-05-10 23:57:22 +02:00
371 lines
No EOL
50 KiB
HTML
371 lines
No EOL
50 KiB
HTML
<!DOCTYPE html><html lang="fr"><head><meta charSet="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><title>Publishing your site · Docusaurus</title><meta name="viewport" content="width=device-width"/><meta name="generator" content="Docusaurus"/><meta name="description" content="Vous devez avoir maintenant un [site fonctionnant localement](/docs/fr/1.12.0/site-creation). Une fois que vous l'avez [personnalisé](/docs/fr/1.12.0/site-config) à votre gout, c'est le temps de le publier. Docusaurus génère un site web HTML statique qui est prêt à être servi par votre serveur web préféré ou une solution d'hébergement en ligne."/><meta name="docsearch:version" content="1.12.0"/><meta name="docsearch:language" content="fr"/><meta property="og:title" content="Publishing your site · Docusaurus"/><meta property="og:type" content="website"/><meta property="og:url" content="https://docusaurus.io/"/><meta property="og:description" content="Vous devez avoir maintenant un [site fonctionnant localement](/docs/fr/1.12.0/site-creation). Une fois que vous l'avez [personnalisé](/docs/fr/1.12.0/site-config) à votre gout, c'est le temps de le publier. Docusaurus génère un site web HTML statique qui est prêt à être servi par votre serveur web préféré ou une solution d'hébergement en ligne."/><meta property="og:image" content="https://docusaurus.io/img/docusaurus.png"/><meta name="twitter:card" content="summary"/><meta name="twitter:image" content="https://docusaurus.io/img/docusaurus.png"/><link rel="shortcut icon" href="/img/docusaurus.ico"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/atom-one-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://docusaurus.io/blog/atom.xml" title="Docusaurus Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://docusaurus.io/blog/feed.xml" title="Docusaurus Blog RSS Feed"/><script>
|
||
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
||
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
|
||
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
|
||
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
|
||
|
||
ga('create', 'UA-44373548-31', 'auto');
|
||
ga('send', 'pageview');
|
||
</script><script type="text/javascript" src="https://buttons.github.io/buttons.js"></script><script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script><script type="text/javascript" src="/js/code-blocks-buttons.js"></script><script src="https://unpkg.com/vanilla-back-to-top@7.1.14/dist/vanilla-back-to-top.min.js"></script><script>
|
||
document.addEventListener('DOMContentLoaded', function() {
|
||
addBackToTop(
|
||
{"zIndex":100}
|
||
)
|
||
});
|
||
</script><script src="/js/scrollSpy.js"></script><link rel="stylesheet" href="/css/prism.css"/><link rel="stylesheet" href="/css/main.css"/><script src="/js/codetabs.js"></script></head><body class="sideNavVisible separateOnPageNav"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/fr"><img class="logo" src="/img/docusaurus.svg" alt="Docusaurus"/><h2 class="headerTitleWithLogo">Docusaurus</h2></a><a href="/fr/versions"><h3>1.12.0</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li class="siteNavGroupActive"><a href="/docs/fr/1.12.0/installation" target="_self">Documentations</a></li><li class=""><a href="/docs/fr/1.12.0/tutorial-setup" target="_self">Tutoriel</a></li><li class=""><a href="/fr/users" target="_self">Utilisateurs</a></li><li class=""><a href="/blog/" target="_self">Blog</a></li><li class=""><a href="https://github.com/facebook/docusaurus" target="_blank">GitHub</a></li><span><li><a id="languages-menu" href="#"><img class="languages-icon" src="/img/language.svg" alt="Languages icon"/>Français</a><div id="languages-dropdown" class="hide"><ul id="languages-dropdown-items"><li><a href="/docs/en/1.12.0/publishing">English</a></li><li><a href="/docs/ko/1.12.0/publishing">한국어</a></li><li><a href="/docs/pt-BR/1.12.0/publishing">Português (Brasil)</a></li><li><a href="/docs/ro/1.12.0/publishing">Română</a></li><li><a href="/docs/ru/1.12.0/publishing">Русский</a></li><li><a href="/docs/zh-CN/1.12.0/publishing">简体中文</a></li><li><a href="https://crowdin.com/project/docusaurus" target="_blank" rel="noreferrer noopener">Aidez-nous à traduire</a></li></ul></div></li><script>
|
||
const languagesMenuItem = document.getElementById("languages-menu");
|
||
const languagesDropDown = document.getElementById("languages-dropdown");
|
||
languagesMenuItem.addEventListener("click", function(event) {
|
||
event.preventDefault();
|
||
|
||
if (languagesDropDown.className == "hide") {
|
||
languagesDropDown.className = "visible";
|
||
} else {
|
||
languagesDropDown.className = "hide";
|
||
}
|
||
});
|
||
</script></span><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search" title="Search"/></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="docsNavContainer" id="docsNav"><nav class="toc"><div class="toggleNav"><section class="navWrapper wrapper"><div class="navBreadcrumb wrapper"><div class="navToggle" id="navToggler"><div class="hamburger-menu"><div class="line1"></div><div class="line2"></div><div class="line3"></div></div></div><h2><i>›</i><span>Premiers pas</span></h2><div class="tocToggler" id="tocToggler"><i class="icon-toc"></i></div></div><div class="navGroups"><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">Premiers pas<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/fr/1.12.0/installation">Installation</a></li><li class="navListItem"><a class="navItem" href="/docs/fr/1.12.0/site-preparation">Site Preparation</a></li><li class="navListItem"><a class="navItem" href="/docs/fr/1.12.0/site-creation">Creating your site</a></li><li class="navListItem navListItemActive"><a class="navItem" href="/docs/fr/1.12.0/publishing">Publishing your site</a></li><li class="navListItem"><a class="navItem" href="/docs/fr/1.12.0/docker">Docker</a></li></ul></div><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">Guides<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/fr/1.12.0/adding-blog">Adding a Blog</a></li><li class="navListItem"><a class="navItem" href="/docs/fr/1.12.0/custom-pages">Custom Pages</a></li><li class="navListItem"><a class="navItem" href="/docs/fr/1.12.0/search">Enabling Search</a></li><li class="navListItem"><a class="navItem" href="/docs/fr/1.12.0/navigation">Navigation and Sidebars</a></li><li class="navListItem"><a class="navItem" href="/docs/fr/1.12.0/translation">Translations & Localization</a></li><li class="navListItem"><a class="navItem" href="/docs/fr/1.12.0/versioning">Versioning</a></li></ul></div><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">API<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/fr/1.12.0/commands">CLI Commands</a></li><li class="navListItem"><a class="navItem" href="/docs/fr/1.12.0/doc-markdown">Markdown Features</a></li><li class="navListItem"><a class="navItem" href="/docs/fr/1.12.0/api-pages">Pages and Styles</a></li><li class="navListItem"><a class="navItem" href="/docs/fr/1.12.0/site-config">siteConfig.js</a></li></ul></div></div></section></div><script>
|
||
var coll = document.getElementsByClassName('collapsible');
|
||
var checkActiveCategory = true;
|
||
for (var i = 0; i < coll.length; i++) {
|
||
var links = coll[i].nextElementSibling.getElementsByTagName('*');
|
||
if (checkActiveCategory){
|
||
for (var j = 0; j < links.length; j++) {
|
||
if (links[j].classList.contains('navListItemActive')){
|
||
coll[i].nextElementSibling.classList.toggle('hide');
|
||
coll[i].childNodes[1].classList.toggle('rotate');
|
||
checkActiveCategory = false;
|
||
break;
|
||
}
|
||
}
|
||
}
|
||
|
||
coll[i].addEventListener('click', function() {
|
||
var arrow = this.childNodes[1];
|
||
arrow.classList.toggle('rotate');
|
||
var content = this.nextElementSibling;
|
||
content.classList.toggle('hide');
|
||
});
|
||
}
|
||
|
||
document.addEventListener('DOMContentLoaded', function() {
|
||
createToggler('#navToggler', '#docsNav', 'docsSliderActive');
|
||
createToggler('#tocToggler', 'body', 'tocActive');
|
||
|
||
var headings = document.querySelector('.toc-headings');
|
||
headings && headings.addEventListener('click', function(event) {
|
||
var el = event.target;
|
||
while(el !== headings){
|
||
if (el.tagName === 'A') {
|
||
document.body.classList.remove('tocActive');
|
||
break;
|
||
} else{
|
||
el = el.parentNode;
|
||
}
|
||
}
|
||
}, false);
|
||
|
||
function createToggler(togglerSelector, targetSelector, className) {
|
||
var toggler = document.querySelector(togglerSelector);
|
||
var target = document.querySelector(targetSelector);
|
||
|
||
if (!toggler) {
|
||
return;
|
||
}
|
||
|
||
toggler.onclick = function(event) {
|
||
event.preventDefault();
|
||
|
||
target.classList.toggle(className);
|
||
};
|
||
}
|
||
});
|
||
</script></nav></div><div class="container mainContainer docsContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://crowdin.com/project/docusaurus/fr" target="_blank" rel="noreferrer noopener">Translate</a><h1 id="__docusaurus" class="postHeaderTitle">Publishing your site</h1></header><article><div><span><p>Vous devez avoir maintenant un <a href="/docs/fr/1.12.0/site-creation">site fonctionnant localement</a>. Une fois que vous l'avez <a href="/docs/fr/1.12.0/site-config">personnalisé</a> à votre gout, c'est le temps de le publier. Docusaurus génère un site web HTML statique qui est prêt à être servi par votre serveur web préféré ou une solution d'hébergement en ligne.</p>
|
||
<h2><a class="anchor" aria-hidden="true" id="création-des-pages-html-statiques"></a><a href="#création-des-pages-html-statiques" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Création des pages HTML statiques</h2>
|
||
<p>Pour créer une version statique de votre site web, exécutez le script suivant dans le dossier <code>website</code>:</p>
|
||
<pre><code class="hljs css language-bash">yarn run build <span class="hljs-comment"># ou `npm run build`</span>
|
||
</code></pre>
|
||
<p>Cela va générer un dossier <code>build</code> dans le dossier <code>website</code> contenant les fichiers <code>.html</code> de toute votre documentation et d'autres pages incluses dans <code>pages</code>.</p>
|
||
<h2><a class="anchor" aria-hidden="true" id="hébergement-de-pages-html-statiques"></a><a href="#hébergement-de-pages-html-statiques" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Hébergement de pages HTML statiques</h2>
|
||
<p>À ce point, vous pouvez prendre tous les fichiers dans le dossier <code>website/build</code> et les copier dans votre dossier <code>html</code> de votre serveur web préféré.</p>
|
||
<blockquote>
|
||
<p>Par exemple, Apache et Nginx diffuse le contenu à partir de <code>/var/www/html</code> par défaut. Cela dit, choisir un serveur web ou un hébergeur est à l'extérieur du cadre de Docusaurus.</p>
|
||
<p>Lorsque vous diffusez le site à partir de votre propre serveur web, assurez-vous que le serveur web fournit bien les fichiers de composants avec les entêtes HTTP appropriés. Les fichiers CSS doivent être servis avec l'entête <code>content-type</code> de <code>text/css</code>. Dans le cas de Nginx, cela signifierait le paramètre <code>inclure /etc/nginx/mime.types;</code> dans votre fichier <code>nginx.conf</code> . Consulter <a href="https://github.com/facebook/docusaurus/issues/602">ce problème</a> pour plus d'informations.</p>
|
||
</blockquote>
|
||
<h3><a class="anchor" aria-hidden="true" id="hébergement-dans-un-service-"></a><a href="#hébergement-dans-un-service-" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Hébergement dans un service :</h3>
|
||
<ul>
|
||
<li><a href="#using-zeit-now">ZEIT Now</a></li>
|
||
<li><a href="#using-github-pages">Github Pages</a></li>
|
||
<li><a href="#hosting-on-netlify">Netlify</a></li>
|
||
<li><a href="#hosting-on-render">Render</a></li>
|
||
</ul>
|
||
<h3><a class="anchor" aria-hidden="true" id="utilisation-de-zeit-now"></a><a href="#utilisation-de-zeit-now" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Utilisation de ZEIT Now</h3>
|
||
<p>Déployer votre projet Docusaurus sur <a href="https://zeit.co/now">ZEIT Now</a> vous fournira <a href="https://zeit.co/now">différents avantages</a> dans les domaines de la performance et de la facilité d'utilisation.</p>
|
||
<p>Mais surtout, le déploiement d'un projet Docusaurus ne prend que quelques secondes :</p>
|
||
<ol>
|
||
<li>Tout d'abord, installez leur <a href="https://zeit.co/download">interface de ligne de commande</a>:</li>
|
||
</ol>
|
||
<pre><code class="hljs css language-bash">npm i -g now
|
||
</code></pre>
|
||
<ol start="2">
|
||
<li>Exécutez une seule commande dans le répertoire racine de votre projet :</li>
|
||
</ol>
|
||
<pre><code class="hljs css language-bash">now
|
||
</code></pre>
|
||
<p><strong>C'est tout.</strong> Vos docs seront automatiquement déployées.</p>
|
||
<h3><a class="anchor" aria-hidden="true" id="utilisation-de-github-pages"></a><a href="#utilisation-de-github-pages" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Utilisation de Github Pages</h3>
|
||
<p>Docusaurus a été conçu pour bien fonctionner avec l'une des solutions d'hébergement les plus populaires pour les projets open source : <a href="https://pages.github.com/">Pages GitHub</a>.</p>
|
||
<h4><a class="anchor" aria-hidden="true" id="déploiement-sur-les-pages-github"></a><a href="#déploiement-sur-les-pages-github" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Déploiement sur les pages GitHub</h4>
|
||
<ol>
|
||
<li>Docusaurus prend en charge le déploiement en tant que <a href="https://help.github.com/articles/user-organization-and-project-pages">pages de projet ou pages d'utilisateur/organisation</a>, votre dépôt de code n'a même pas besoin d'être public.</li>
|
||
</ol>
|
||
<blockquote>
|
||
<p>Même si votre dépôt est privé, tout ce qui est publié dans une branche <code>gh-pages</code> sera <a href="https://help.github.com/articles/user-organization-and-project-pages/">public</a>.</p>
|
||
</blockquote>
|
||
<p><strong>Remarque :</strong> Lorsque vous déployez en tant qu'utilisateur/organisation des pages, le script de publication va déployer ces sites à la racine de la branche <strong><code>master</code></strong> du dépôt <em>username</em>.github.io. Dans ce cas, notez que vous aurez l'infra de Docusaurus, vos docs, etc. soit dans <strong>une autre branche de <em>username</em>.github.io repo</strong> (par exemple, appelée <code>source</code>), ou dans un autre dépôt séparé (par exemple dans le même que le code source documenté).</p>
|
||
<ol start="2">
|
||
<li>Vous devrez modifier le fichier <code>website/siteConfig.js</code> et ajouter les paramètres requis.</li>
|
||
</ol>
|
||
<table>
|
||
<thead>
|
||
<tr><th>Nom</th><th>Description</th></tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr><td><code>organizationName</code></td><td>L'utilisateur ou l'organisation GitHub qui possède le dépôt. Si vous en êtes le propriétaire, c'est votre nom d'utilisateur GitHub. Dans le cas de Docusaurus, ce serait l'organisation GitHub "<em>facebook</em>".</td></tr>
|
||
<tr><td><code>projectName</code></td><td>Le nom du dépôt GitHub pour votre projet. Par exemple, le code source de Docusaurus est hébergé sur <a href="https://github.com/facebook/docusaurus">https://github.com/facebook/docusaurus</a>, donc le nom de notre projet dans ce cas serait "docusaurus".</td></tr>
|
||
<tr><td><code>url</code></td><td>L'URL de votre site web. Pour les projets hébergés sur des pages GitHub, ce sera "https://<em>username</em>.github.io"</td></tr>
|
||
<tr><td><code>baseUrl</code></td><td>L'URL de base pour votre projet. Pour les projets hébergés sur des pages GitHub, il suit le format "/<em>projectName</em>/". Pour <a href="https://github.com/facebook/docusaurus">https://github.com/facebook/docusaurus</a>, <code>baseUrl</code> est <code>/docusaurus/</code>.</td></tr>
|
||
</tbody>
|
||
</table>
|
||
<pre><code class="hljs css language-js"><span class="hljs-keyword">const</span> siteConfig = {
|
||
...
|
||
url: <span class="hljs-string">'https://__userName__.github.io'</span>, <span class="hljs-comment">// L'URL de votre site web</span>
|
||
<span class="hljs-attr">baseUrl</span>: <span class="hljs-string">'/testProject/'</span>,
|
||
<span class="hljs-attr">projectName</span>: <span class="hljs-string">'testProject'</span>,
|
||
<span class="hljs-attr">organizationName</span>: <span class="hljs-string">'userName'</span>
|
||
...
|
||
}
|
||
</code></pre>
|
||
<p>Dans le cas où vous souhaitez déployer le site en tant qu'utilisateur ou organisation, spécifiez le nom du projet comme <code><username>.github.io</code> ou <code><orgname>.github.io</code>. Par exemple, si votre nom d'utilisateur GitHub est "user42", alors cela sera <em>user42.github.io</em>, ou dans le cas d'un nom d'organisation de "org123", cela sera <em>org123.github.io</em>.</p>
|
||
<p><strong>Remarque :</strong> Ne pas définir <code>url</code> et <code>baseUrl</code> de votre projet peuvent entraîner la création de chemins de fichiers incorrects qui peuvent casser des liens vers des chemins de ressources tels que les feuilles de style et les images.</p>
|
||
<blockquote>
|
||
<p>Bien que nous recommandions de définir les <code>projectName</code> et <code>organizationName</code> dans <code>siteConfig.js</code>, vous pouvez également utiliser les variables d'environnement <code>ORGANIZATION_NAME</code> et <code>PROJECT_NAME</code>.</p>
|
||
</blockquote>
|
||
<ol start="3">
|
||
<li>Maintenant vous devez spécifier l'utilisateur git comme variable d'environnement, et exécuter le script <a href="/docs/fr/1.12.0/commands#docusaurus-publish"><code>publish-gh-pages</code></a></li>
|
||
</ol>
|
||
<table>
|
||
<thead>
|
||
<tr><th>Nom</th><th>Description</th></tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr><td><code>GIT_USER</code></td><td>Le nom d'utilisateur d'un compte GitHub qui a un accès à ce dépôt. Pour vos propres dépôts, ce sera habituellement votre propre nom d'utilisateur GitHub. Le <code>GIT_USER</code> spécifié doit avoir accès au dépôt spécifié dans la combinaison de <code>organisationName</code> et <code>projectName</code>.</td></tr>
|
||
</tbody>
|
||
</table>
|
||
<p>Pour exécuter le script directement à partir de la ligne de commande, vous pouvez utiliser le suivant, en remplissant les valeurs de paramètre comme il se doit.</p>
|
||
<pre><code class="hljs css language-bash">GIT_USER=<GIT_USER> \
|
||
CURRENT_BRANCH=master \
|
||
USE_SSH=<span class="hljs-literal">true</span> \
|
||
yarn run publish-gh-pages <span class="hljs-comment"># ou `npm run publish-gh-pages`</span>
|
||
</code></pre>
|
||
<p>Il y a également deux paramètres optionnels définis comme variables d'environnement :</p>
|
||
<table>
|
||
<thead>
|
||
<tr><th>Nom</th><th>Description</th></tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr><td><code>USE_SSH</code></td><td>Si cela est défini à <code>true</code>, alors SSH est utilisé au lieu de HTTPS pour la connexion au dépôt GitHub. HTTPS est la valeur par défaut si cette variable n'est pas définie.</td></tr>
|
||
<tr><td><code>CURRENT_BRANCH</code></td><td>La branche qui contient les dernières modifications docs qui seront déployées. Habituellement, la branche sera <code>master</code>, mais peut être n'importe quelle branche (par défaut ou autrement) sauf pour <code>gh-pages</code>. Si rien n'est défini pour cette variable, la branche actuelle sera utilisée.</td></tr>
|
||
</tbody>
|
||
</table>
|
||
<p>Si vous rencontrez des problèmes liés aux clés SSH, visitez la documentation d'authentification <a href="https://help.github.com/articles/connecting-to-github-with-ssh/">GitHub</a>.</p>
|
||
<p>Vous devriez maintenant pouvoir charger votre site en visitant son URL GitHub Pages, ce qui pourrait être quelque chose en suivant les lignes de https://<em>nom d'utilisateur</em>.github.io/<em>projectName</em>, ou un domaine personnalisé si vous avez configuré cette page. Par exemple, l'URL GitHub de Docusaurus est <a href="https://facebook.github.io/Docusaurus">https://facebook.github.io/Docusaurus</a> car elle est desservie par la branche <code>gh-pages</code> du dépôt GitHub <a href="https://github.com/facebook/docurus">https://github.com/facebook/docurus</a>. Cependant, il est également accessible via <a href="https://docusaurus.io/">https://docusaurus.io/</a>, via un fichier <code>CNAME</code> généré qui peut être configuré via <code>cname</code> de l'<a href="/docs/fr/1.12.0/site-config#cname-string">option siteConfig</a>.</p>
|
||
<p>Nous encourageons vivement la lecture à travers la documentation <a href="https://pages.github.com">GitHub Pages</a> pour en savoir plus sur le fonctionnement de cette solution d'hébergement.</p>
|
||
<p>Vous pouvez exécuter la commande au-dessus de chaque fois que vous mettez à jour les documents et que vous souhaitez déployer les modifications de votre site. L'exécution manuelle du script peut être excellente pour les sites où la documentation change rarement et il n'est pas trop gênant de se souvenir de déployer manuellement des modifications.</p>
|
||
<p>Cependant, vous pouvez automatiser le processus de publication avec une intégration continue (CI).</p>
|
||
<h2><a class="anchor" aria-hidden="true" id="automatisation-des-déploiements-en-utilisant-une-intégration-continue"></a><a href="#automatisation-des-déploiements-en-utilisant-une-intégration-continue" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Automatisation des déploiements en utilisant une intégration continue</h2>
|
||
<p>Les services d'intégration continue (CI) sont généralement utilisés pour effectuer des tâches de routine lorsque de nouveaux commits sont vérifiés pour contrôler la source. Ces tâches peuvent être une combinaison de tests unitaires et de tests d'intégration, d'automatisation des builds, de publication des paquets vers NPM, et oui, de déploiement de modifications sur votre site Web. Tout ce que vous devez faire pour automatiser le déploiement de votre site est d'invoquer le script <code>publish-gh-pages</code> chaque fois que vos docs sont mis à jour. Dans la section suivante, nous allons couvrir la façon de faire juste cela en utilisant <a href="https://circleci.com/">CircleCI</a>, un fournisseur de service d'intégration continue populaire.</p>
|
||
<h3><a class="anchor" aria-hidden="true" id="utilisation-de-circleci-20"></a><a href="#utilisation-de-circleci-20" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Utilisation de CircleCI 2.0</h3>
|
||
<p>Si vous ne l'avez pas déjà fait, vous pouvez <a href="https://circleci.com/signup/">configurer CircleCI</a> pour votre projet open source. Ensuite, afin d'activer le déploiement automatique de votre site et de la documentation via CircleCI, il suffit de configurer Circle pour exécuter le script <code>publish-gh-pages</code> dans la partie de l'étape de déploiement. Vous pouvez suivre les étapes ci-dessous pour obtenir cette configuration.</p>
|
||
<ol>
|
||
<li>Assurez-vous que le compte GitHub qui sera défini comme <code>GIT_USER</code> a l'accès d'<code>écriture</code> au dépôt qui contient la documentation, en vérifiant <code>Paramètres | Collaborateurs & équipes</code> dans le dépôt.</li>
|
||
<li>Connectez-vous à GitHub sous <code>GIT_USER</code>.</li>
|
||
<li>Allez sur <a href="https://github.com/settings/tokens">https://github.com/settings/tokens</a> pour le <code>GIT_USER</code> et générez un nouveau <a href="https://help.github.com/articles/creating-a-personal-access-token-for-the-command-line/">jeton d'accès personnel</a>, lui accordant le contrôle total des dépôts privés via le champ d'application <code>repository</code>. Stockez ce jeton dans un endroit sûr, assurez-vous de ne pas le partager avec n'importe qui. Ce jeton peut être utilisé pour authentifier les actions GitHub en votre nom à la place de votre mot de passe GitHub.</li>
|
||
<li>Ouvrez votre tableau de bord CircleCI et naviguez sur la page Paramètres de votre dépôt, puis sélectionnez "variables d'environnement". L'URL ressemble à <a href="https://circleci.com/gh/ORG/REPO/edit#env-vars">https://circleci.com/gh/ORG/REPO/edit#env-vars</a>, où "ORG/REPO" devrait être remplacé par votre propre organisation/référentiel GitHub.</li>
|
||
<li>Créez une nouvelle variable d'environnement nommée <code>GITHUB_TOKEN</code>, en utilisant votre jeton d'accès nouvellement généré comme valeur.</li>
|
||
<li>Créez un répertoire <code>.circleci</code> et créez un fichier <code>config.yml</code> dans ce répertoire.</li>
|
||
<li>Copiez le texte ci-dessous dans <code>.circleci/config.yml</code>.</li>
|
||
</ol>
|
||
<pre><code class="hljs css language-yaml"><span class="hljs-comment"># Si vous voulez seulement que le circle s'exécute sur des commits directs sur master, vous pouvez décommenter ceci</span>
|
||
<span class="hljs-comment"># et décommenter les filtres : *filter-only-master aussi ci-dessous</span>
|
||
<span class="hljs-comment">#</span>
|
||
<span class="hljs-comment"># aliases:</span>
|
||
<span class="hljs-comment"># - &filter-only-master</span>
|
||
<span class="hljs-comment"># branches:</span>
|
||
<span class="hljs-comment"># only:</span>
|
||
<span class="hljs-comment"># - master</span>
|
||
|
||
<span class="hljs-attr">version:</span> <span class="hljs-number">2</span>
|
||
<span class="hljs-attr">jobs:</span>
|
||
<span class="hljs-attr">deploy-website:</span>
|
||
<span class="hljs-attr">docker:</span>
|
||
<span class="hljs-comment"># indiquez ici la version que vous désirez</span>
|
||
|
||
<span class="hljs-bullet">-</span> <span class="hljs-attr">image:</span> <span class="hljs-string">circleci/node:8.11.1</span>
|
||
|
||
<span class="hljs-attr">steps:</span>
|
||
|
||
<span class="hljs-bullet">-</span> <span class="hljs-string">checkout</span>
|
||
<span class="hljs-bullet">-</span> <span class="hljs-attr">run:</span>
|
||
<span class="hljs-attr">name:</span> <span class="hljs-string">Deploying</span> <span class="hljs-string">to</span> <span class="hljs-string">GitHub</span> <span class="hljs-string">Pages</span>
|
||
<span class="hljs-attr">command:</span> <span class="hljs-string">|
|
||
git config --global user.email "<GITHUB_USERNAME>@users.noreply.github.com"
|
||
git config --global user.name "<YOUR_NAME>"
|
||
echo "machine github.com login <GITHUB_USERNAME> password $GITHUB_TOKEN" > ~/.netrc
|
||
cd website && yarn install && GIT_USER=<GIT_USER> yarn run publish-gh-pages
|
||
</span>
|
||
<span class="hljs-attr">workflows:</span>
|
||
<span class="hljs-attr">version:</span> <span class="hljs-number">2</span>
|
||
<span class="hljs-attr">build_and_deploy:</span>
|
||
<span class="hljs-attr">jobs:</span>
|
||
|
||
<span class="hljs-bullet">-</span> <span class="hljs-attr">deploy-website:</span>
|
||
<span class="hljs-comment"># filters: *filter-only-master</span>
|
||
</code></pre>
|
||
<p>Assurez-vous de remplacer tous les <code><....></code> dans <code>command:</code> avec des valeurs appropriées. Pour <code><GIT_USER></code>, c'est un compte GitHub qui a accès à la documentation pour pousser dans votre dépôt GitHub. De nombreuses fois <code><GIT_USER></code> et <code><GITHUB_USERNAME></code> seront les mêmes.</p>
|
||
<p><strong>NE PAS</strong> placer la valeur réelle de <code>$GITHUB_TOKEN</code> dans <code>circle.yml</code>. Nous avons déjà configuré cela en tant que variable d'environnement à l'étape 5.</p>
|
||
<blockquote>
|
||
<p>Si vous voulez utiliser SSH pour votre connexion de dépôt GitHub, vous pouvez définir <code>USE_SSH=true</code>. La commande ci-dessus ressemblerait donc à : <code>cd website && npm install && GIT_USER=<GIT_USER> USE_SSH=true npm run publish-gh-pages</code>.</p>
|
||
<p>Contrairement au script <code>publish-gh-pages</code> lancé manuellement, lorsque le script s'exécute dans l'environnement Circle, la valeur de <code>CURRENT_BRANCH</code> est déjà définie comme une variable d'environnement <a href="https://circleci.com/docs/1.0/environment-variables/">dans CircleCI</a> et sera récupérée automatiquement par le script.</p>
|
||
</blockquote>
|
||
<p>Maintenant, chaque fois qu'un nouveau commit se trouve dans <code>master</code>, CircleCI exécutera votre suite de tests et, si tout passe, votre site sera déployé via le script <code>publish-gh-pages</code> .</p>
|
||
<blockquote>
|
||
<p>Si vous préférez utiliser une clé de déploiement au lieu d'un jeton d'accès personnel, vous pouvez en commençant par les <a href="https://circleci.com/docs/1.0/adding-read-write-deployment-key/">instructions</a> de CircleCI pour ajouter une clé de déploiement en lecture/écriture.</p>
|
||
</blockquote>
|
||
<h3><a class="anchor" aria-hidden="true" id="conseils--astuces"></a><a href="#conseils--astuces" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Conseils & astuces</h3>
|
||
<p>Lorsque vous déployez pour la première fois la branche <code>gh-pages</code> en utilisant CircleCI, vous pouvez remarquer que certains jobs déclenchés par des commits sur la branche <code>gh-pages</code> ne parviennent pas s'exécuter correctement à cause du manque de tests (cela peut également envoyer des notifications de builds échoués sur chat/slack).</p>
|
||
<p>Vous pouvez contourner cela :</p>
|
||
<ul>
|
||
<li>Définition de la variable d'environnement <code>CUSTOM_COMMIT_MESSAGE</code> dans la commande <code>publish-gh-pages</code> avec le contenu de <code>[skip ci]</code>. Par exemple :</li>
|
||
</ul>
|
||
<pre><code class="hljs css language-bash">CUSTOM_COMMIT_MESSAGE=<span class="hljs-string">"[skip ci]"</span> \
|
||
yarn run publish-gh-pages <span class="hljs-comment"># ou `npm run publish-gh-pages`</span>
|
||
</code></pre>
|
||
<ul>
|
||
<li>Vous pouvez également travailler autour de cela en créant une configuration CircleCI basique avec le contenu suivant :</li>
|
||
</ul>
|
||
<pre><code class="hljs css language-yaml"><span class="hljs-comment"># CircleCI 2.0 Fichier de configuration</span>
|
||
<span class="hljs-comment"># Ce fichier de configuration empêchera l'exécution de tests sur la branche gh-pages.</span>
|
||
<span class="hljs-attr">version:</span> <span class="hljs-number">2</span>
|
||
<span class="hljs-attr">jobs:</span>
|
||
<span class="hljs-attr">build:</span>
|
||
<span class="hljs-attr">machine:</span> <span class="hljs-literal">true</span>
|
||
<span class="hljs-attr">branches:</span>
|
||
<span class="hljs-attr">ignore:</span> <span class="hljs-string">gh-pages</span>
|
||
<span class="hljs-attr">steps:</span>
|
||
<span class="hljs-bullet">-</span> <span class="hljs-attr">run:</span> <span class="hljs-string">echo</span> <span class="hljs-string">"Ignore les tests sur la branche gh-pages"</span>
|
||
</code></pre>
|
||
<p>Enregistrez ce fichier sous le nom <code>config.yml</code> et placez-le dans un répertoire <code>.circleci</code> dans votre répertoire <code>website/static</code>.</p>
|
||
<h3><a class="anchor" aria-hidden="true" id="utilisation-de-travis-ci"></a><a href="#utilisation-de-travis-ci" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Utilisation de Travis CI</h3>
|
||
<ol>
|
||
<li>Allez sur <a href="https://github.com/settings/tokens">https://github.com/settings/tokens</a> et générez un nouveau <a href="https://help.github.com/articles/creating-a-personal-access-token-for-the-command-line/">jeton d'accès personnel</a></li>
|
||
<li>En utilisant votre compte GitHub, <a href="https://github.com/marketplace/travis-ci">ajoutez l'application Travis CI</a> au dépôt que vous souhaitez activer.</li>
|
||
<li>Ouvrez votre tableau de bord Travis CI. L'URL ressemble à <a href="https://travis-ci.com/USERNAME/REPO">https://travis-ci.com/USERNAME/REPO</a>, et accédez à la section <code>Plus d'options</code> > <code>Paramètres</code> > <code>Variables d'environnement</code> de votre dépôt.</li>
|
||
<li>Créez une nouvelle variable d'environnement nommée <code>GH_TOKEN</code> avec votre jeton nouvellement généré, puis <code>GH_EMAIL</code> (votre adresse e-mail) et <code>GH_NAME</code> (votre nom d'utilisateur GitHub).</li>
|
||
<li>Créez un <code>.travis.yml</code> à la racine de votre dépôt avec le texte ci-dessous.</li>
|
||
</ol>
|
||
<pre><code class="hljs css language-yaml"><span class="hljs-comment"># .travis.yml</span>
|
||
<span class="hljs-attr">language:</span> <span class="hljs-string">node_js</span>
|
||
<span class="hljs-attr">node_js:</span>
|
||
<span class="hljs-bullet">-</span> <span class="hljs-string">'8'</span>
|
||
<span class="hljs-attr">branches:</span>
|
||
<span class="hljs-attr">only:</span>
|
||
<span class="hljs-bullet">-</span> <span class="hljs-string">master</span>
|
||
<span class="hljs-attr">cache:</span>
|
||
<span class="hljs-attr">yarn:</span> <span class="hljs-literal">true</span>
|
||
<span class="hljs-attr">script:</span>
|
||
<span class="hljs-bullet">-</span> <span class="hljs-string">git</span> <span class="hljs-string">config</span> <span class="hljs-string">--global</span> <span class="hljs-string">user.name</span> <span class="hljs-string">"${GH_NAME}"</span>
|
||
<span class="hljs-bullet">-</span> <span class="hljs-string">git</span> <span class="hljs-string">config</span> <span class="hljs-string">--global</span> <span class="hljs-string">user.email</span> <span class="hljs-string">"${GH_EMAIL}"</span>
|
||
<span class="hljs-bullet">-</span> <span class="hljs-string">echo</span> <span class="hljs-string">"machine github.com login ${GH_NAME} password ${GH_TOKEN}"</span> <span class="hljs-string">></span> <span class="hljs-string">~/.netrc</span>
|
||
<span class="hljs-bullet">-</span> <span class="hljs-string">cd</span> <span class="hljs-string">website</span> <span class="hljs-string">&&</span> <span class="hljs-string">yarn</span> <span class="hljs-string">install</span> <span class="hljs-string">&&</span> <span class="hljs-string">GIT_USER="${GH_NAME}"</span> <span class="hljs-string">yarn</span> <span class="hljs-string">run</span> <span class="hljs-string">publish-gh-pages</span>
|
||
</code></pre>
|
||
<p>Maintenant, chaque fois qu'un nouveau commit se trouve dans <code>master</code>, Travis CI exécutera votre suite de tests et, si tout passe, votre site sera déployé via le script <code>publish-gh-pages</code> .</p>
|
||
<h3><a class="anchor" aria-hidden="true" id="hébergement-sur-zeit-now"></a><a href="#hébergement-sur-zeit-now" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Hébergement sur ZEIT now</h3>
|
||
<p>Avec <a href="#using-zeit-now">ZEIT Now</a>, vous pouvez déployer votre site et le connecter à <a href="https://zeit.co/github">GitHub</a> ou <a href="https://zeit.co/gitlab">GitLab</a> pour recevoir automatiquement un nouveau déploiement à chaque fois que vous pousser un commit.</p>
|
||
<h3><a class="anchor" aria-hidden="true" id="hébergement-sur-netlify"></a><a href="#hébergement-sur-netlify" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Hébergement sur Netlify</h3>
|
||
<p>Étapes pour configurer votre site alimenté par Docusaurus sur Netlify.</p>
|
||
<ol>
|
||
<li>Sélectionnez <strong>Nouveau site depuis Git</strong></li>
|
||
<li>Connectez-vous à votre fournisseur Git préféré.</li>
|
||
<li>Sélectionnez la branche à déployer. La valeur par défaut est <code>master</code></li>
|
||
<li>Configurez vos étapes de construction :</li>
|
||
</ol>
|
||
<ul>
|
||
<li>Pour votre commande de build, saisissez : <code>cd website; npm install; npm run build;</code></li>
|
||
<li>Pour publier le répertoire : <code>website/build/<projectName></code> (utilisez le <code>projectName</code> de votre <code>siteConfig</code>)</li>
|
||
</ul>
|
||
<ol>
|
||
<li>Cliquez sur <strong>Déployer site</strong></li>
|
||
</ol>
|
||
<p>Vous pouvez également configurer Netlify pour qu'il reconstruise sur chaque commit de votre dépôt, ou seulement sur les commits de la branche <code>master</code>.</p>
|
||
<h3><a class="anchor" aria-hidden="true" id="hébergement-sur-render"></a><a href="#hébergement-sur-render" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Hébergement sur Render</h3>
|
||
<p>Render offre gratuitement l'hebergement d'un <a href="https://render.com/docs/static-sites">site statique</a> avec SSL entièrement géré, domaines personnalisés, un CDN global et des déploiements continus automatiques de votre dépôt Git. Déployez votre application en quelques minutes en suivant ces étapes.</p>
|
||
<ol>
|
||
<li><p>Créez un nouveau <strong>Service Web</strong> sur Render, et donnez la permission à l'application GitHub de Render d'accéder à votre dépôt Docusaurus.</p></li>
|
||
<li><p>Sélectionnez la branche à déployer. La valeur par défaut est <code>master</code>.</p></li>
|
||
<li><p>Entrez les valeurs suivantes pendant la création.</p></li>
|
||
</ol>
|
||
<table>
|
||
<thead>
|
||
<tr><th>Champ</th><th>Valeur</th></tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr><td><strong>Environment</strong></td><td><code>Site statique</code></td></tr>
|
||
<tr><td><strong>Build Command</strong></td><td><code>cd website; yarn install; yarn build</code></td></tr>
|
||
<tr><td><strong>Publish Directory</strong></td><td><code>website/build/<projectName></code></td></tr>
|
||
</tbody>
|
||
</table>
|
||
<pre><code class="hljs">`projectName` est la valeur que vous avez définie dans votre `siteConfig.js`.
|
||
</code></pre>
|
||
<pre><code class="hljs css language-javascript{7}"><span class="hljs-keyword">const</span> siteConfig = {
|
||
<span class="hljs-comment">// ...</span>
|
||
projectName: <span class="hljs-string">'votre-nom-projet'</span>,
|
||
<span class="hljs-comment">// ...</span>
|
||
</code></pre>
|
||
<p>C'est tout ! Votre application sera directement sur votre URL Render dès que la version sera terminée.</p>
|
||
<h3><a class="anchor" aria-hidden="true" id="publication-sur-github-enterprise"></a><a href="#publication-sur-github-enterprise" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Publication sur GitHub Enterprise</h3>
|
||
<p>Les installations de GitHub entreprise devraient fonctionner de la même manière que github.com; vous n'avez qu'à identifier l'hôte GitHub Enterprise de l'organisation.</p>
|
||
<table>
|
||
<thead>
|
||
<tr><th>Nom</th><th>Description</th></tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr><td><code>GITHUB_HOST</code></td><td>Le nom d'hôte du serveur d'entreprise GitHub.</td></tr>
|
||
</tbody>
|
||
</table>
|
||
<p>Modifiez votre <code>siteConfig.js</code> pour ajouter une propriété <code>'githubHost'</code> qui représente le nom d'hôte GitHub Entreprise. Autrement, définissez une variable d'environnement <code>GITHUB_HOST</code> lors de l'exécution de la commande publication.</p>
|
||
</span></div></article></div><div class="docs-prevnext"><a class="docs-prev button" href="/docs/fr/1.12.0/site-creation"><span class="arrow-prev">← </span><span>Création de votre site</span></a><a class="docs-next button" href="/docs/fr/1.12.0/docker"><span>Docker</span><span class="arrow-next"> →</span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#création-des-pages-html-statiques">Création des pages HTML statiques</a></li><li><a href="#hébergement-de-pages-html-statiques">Hébergement de pages HTML statiques</a><ul class="toc-headings"><li><a href="#hébergement-dans-un-service-">Hébergement dans un service :</a></li><li><a href="#utilisation-de-zeit-now">Utilisation de ZEIT Now</a></li><li><a href="#utilisation-de-github-pages">Utilisation de Github Pages</a></li></ul></li><li><a href="#automatisation-des-déploiements-en-utilisant-une-intégration-continue">Automatisation des déploiements en utilisant une intégration continue</a><ul class="toc-headings"><li><a href="#utilisation-de-circleci-20">Utilisation de CircleCI 2.0</a></li><li><a href="#conseils--astuces">Conseils & astuces</a></li><li><a href="#utilisation-de-travis-ci">Utilisation de Travis CI</a></li><li><a href="#hébergement-sur-zeit-now">Hébergement sur ZEIT now</a></li><li><a href="#hébergement-sur-netlify">Hébergement sur Netlify</a></li><li><a href="#hébergement-sur-render">Hébergement sur Render</a></li><li><a href="#publication-sur-github-enterprise">Publication sur GitHub Enterprise</a></li></ul></li></ul></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/" class="nav-home"><img src="/img/docusaurus_monochrome.svg" alt="Docusaurus" width="66" height="58"/></a><div class="footerSection"><h5>Docs</h5><a href="
|
||
/docs/fr/installation">Getting Started</a><a href="
|
||
/docs/fr/versioning">Versioning</a><a href="
|
||
/docs/fr/translation">Localization</a><a href="
|
||
/docs/fr/search">Adding Search</a></div><div class="footerSection"><h5>Community</h5><a href="/fr/help">Help</a><a href="/fr/users">User Showcase</a><a href="/fr/about-slash">About</a></div><div class="footerSection"><h5>Legal</h5><a href="https://opensource.facebook.com/legal/privacy/" target="_blank" rel="noreferrer noopener">Privacy</a><a href="https://opensource.facebook.com/legal/terms/" target="_blank" rel="noreferrer noopener">Terms</a></div><div class="footerSection"><h5>Social</h5><div class="social"><a class="github-button" href="https://github.com/facebook/docusaurus" data-count-href="https://github.com/facebook/docusaurus/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">docusaurus</a></div><div class="social"><a href="https://twitter.com/docusaurus" class="twitter-follow-button">Follow @docusaurus</a></div><div class="social"><div class="fb-like" data-href="https://docusaurus.io" data-colorscheme="dark" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></section><a href="https://opensource.facebook.com/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright"><span>Copyright © 2020 Facebook Inc.</span> Landing images by <a href="https://undraw.co/">unDraw</a>.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'199138890728411',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
|
||
</script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
|
||
document.addEventListener('keyup', function(e) {
|
||
if (e.target !== document.body) {
|
||
return;
|
||
}
|
||
// keyCode for '/' (slash)
|
||
if (e.keyCode === 191) {
|
||
const search = document.getElementById('search_input_react');
|
||
search && search.focus();
|
||
}
|
||
});
|
||
</script><script>
|
||
var search = docsearch({
|
||
|
||
apiKey: '3eb9507824b8be89e7a199ecaa1a9d2c',
|
||
indexName: 'docusaurus',
|
||
inputSelector: '#search_input_react',
|
||
algoliaOptions: {"facetFilters":["language:fr","version:1.12.0"]}
|
||
});
|
||
</script></body></html> |