丛林黑文子 發表於 2020-7-8 12:37:00

Hexo、Gitee,2020年最新安装部署完整过程

<h2 id="安装-git">安装 git</h2>
<ul>
<li>Download Page of Mac OS X</li>
<li>Download Page of Windows</li>
<li>Download Page of Linux/Unix</li>
</ul>
<h2 id="安装-nodejs">安装 nodejs</h2>
<ul>
<li>Download Page (English)</li>
<li>下载地址 (中文)</li>
</ul>

<h2 id="修改配置">修改配置</h2>
<p>国内淘宝NPM镜像使用方法(三种办法任意一种都能解决问题,建议使用第三种,将配置写死,下次用的时候配置还在):</p>
<ul>
<li>通过config命令</li>
</ul>
<pre><code class="language-bash">//If In China, you can set mirror to speed up !
npm config set registry "https://registry.npm.taobao.org/"
npm config set electron_mirror "https://npm.taobao.org/mirrors/electron/"
</code></pre>
<ul>
<li>命令行指定</li>
</ul>
<pre><code class="language-bash">npm --registry https://registry.npm.taobao.org info underscore
</code></pre>
<ul>
<li>编辑 ~/.npmrc 加入下面内容
<ul>
<li>Windows : <code>%HOMEPATH%/</code></li>
<li>Linux/Unix/Mac: <code>~/</code></li>
</ul>
</li>
</ul>
<pre><code class="language-bash">registry=https://registry.npm.taobao.org/
electron_mirror=https://npm.taobao.org/mirrors/electron/
</code></pre>
<p>If you want change cache path, Please refer to the following configuration !</p>
<pre><code class="language-bash">//Windows:
npm config set prefix "C:/Program Files/nodejs/npm_global"
npm config set cache "C:/Program Files/nodejs/npm_cache"

//Linux\Mac:
npm config set prefix "~/nodejs/npm_global"
npm config set cache "~/nodejs/npm_cache"
</code></pre>
<h2 id="hexo安装">Hexo安装</h2>
<h3 id="1-在自己喜欢的位置建个hexo文件夹">1. 在自己喜欢的位置建个Hexo文件夹</h3>
<h3 id="2-在shell就是你的gitbase中cd到你刚才建的文件夹里去">2. 在shell(就是你的GitBase)中cd到你刚才建的文件夹里去,</h3>
<pre><code class="language-bash">//例如我新建的是D盘,Hexo文件夹
cd D:
cd Hexo
</code></pre>
<h3 id="3-在hexo目录下安装hexo">3. 在Hexo目录下安装Hexo</h3>
<pre><code class="language-base">npm install -g hexo-cli
</code></pre>
<h3 id="4-检测hexo是否安装成功">4. 检测<code>hexo</code>是否安装成功。</h3>
<pre><code class="language-bash">hexo -v
</code></pre>
<h3 id="5-初始化hexo">5. 初始化hexo</h3>
<pre><code class="language-bash">hexo init blog
</code></pre>
<p>blog是会创建一个blog文件夹,如果不在<code>hexo init</code>后面加<em>blog</em>的话,会在你当前的文件夹下初始化<code>hexo</code></p>
<h3 id="6-转到刚刚初始化的blog文件夹下">6. 转到刚刚初始化的<em>blog</em>文件夹下。</h3>
<pre><code class="language-bash">cd blog/
</code></pre>
<p>这时你会发现里面新建了很多文件夹。</p>
<h3 id="7-安装npm-依赖项">7. 安装<em>npm</em> 依赖项。</h3>
<pre><code class="language-bash">npm install
</code></pre>
<h3 id="8-hexo-g生成静态文件">8. <code>hexo g</code>,生成静态文件。</h3>
<p><img src="https://img-blog.csdnimg.cn/20200708114524652.png"></p>
<h3 id="9-启动服务器">9. 启动服务器。</h3>
<pre><code class="language-bash">hexo server
</code></pre>
<h3 id="10-访问httplocalhost4000出现如下页面就代表你搭建成功了">10. 访问:<code>http://localhost:4000/</code>,出现如下页面就代表你搭建成功了。</h3>
<p><img src="https://img-blog.csdnimg.cn/20200708114653172.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RhbmllbF93YW5ndA==,size_16,color_FFFFFF,t_70"></p>
<h2 id="hexo-主题安装">hexo 主题安装</h2>
<h3 id="1-hexo官网主题商店里下一个模板">1. hexo官网主题商店里下一个模板</h3>
<h3 id="2-修改配置文件_configyml">2. 修改配置文件<code>_config.yml</code></h3>
<p>hexo默认主题是<code>landscape</code></p>
<pre><code class="language-yaml">theme: hexo-theme-snippet//此处为你下载的主题名称
</code></pre>
<h3 id="3-生成静态文件">3. 生成静态文件</h3>
<pre><code class="language-bash">hexo g
</code></pre>
<h3 id="4-发布">4. 发布</h3>
<pre><code class="language-bash">hexo s
</code></pre>
<h3 id="5-访问httplocalhost4000">5. 访问:<code>http://localhost:4000/</code></h3>
<p><img src="https://img-blog.csdnimg.cn/20200708114720996.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RhbmllbF93YW5ndA==,size_16,color_FFFFFF,t_70"></p>
<p>现在就可以将这个博客发布到gitee或者github或者coding上了。</p>
<h2 id="gitee环境部署">Gitee环境部署</h2>
<h3 id="1-注册gitee账号">1. 注册gitee账号</h3>
<p>登录gitee进行注册</p>
<h3 id="2-新建仓库">2. 新建仓库</h3>
<p><img src="https://img-blog.csdnimg.cn/20200708114742722.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RhbmllbF93YW5ndA==,size_16,color_FFFFFF,t_70"></p>
<h3 id="3-填写信息创建仓库">3. 填写信息,创建仓库</h3>
<p><img src="https://img-blog.csdnimg.cn/20200708114819473.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RhbmllbF93YW5ndA==,size_16,color_FFFFFF,t_70"></p>
<p><img src="https://img-blog.csdnimg.cn/20200708114837851.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RhbmllbF93YW5ndA==,size_16,color_FFFFFF,t_70"></p>
<p>新建仓库时名称最好是保持跟你注册时的<strong>个人空间地址</strong>是一样的。因为这样你就不会生成二级域名了。如果不跟注册时的<em>个人空间地址</em>一样的话,到时候自己的网站就会有二级域名的存在了。</p>
<p>点击完创建后,就会跳到仓库页面。</p>
<h3 id="4部署静态服务">4.部署静态服务</h3>
<p><img src="https://img-blog.csdnimg.cn/20200708114857654.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RhbmllbF93YW5ndA==,size_16,color_FFFFFF,t_70"></p>
<p>点击服务,Gitee Pages。</p>
<p><img src="https://img-blog.csdnimg.cn/20200708114916954.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RhbmllbF93YW5ndA==,size_16,color_FFFFFF,t_70"></p>
<p>选择强制使用HTTPS</p>
<p>然后启动。</p>
<p>这个时候就会给你生成一个类似<code>https://{你的个人空间地址}.gitee.io(仓库名跟个人空间地址一致)</code>或者<code>https://{你的个人空间地址}.gitee.io/{你的仓库名}(仓库名跟个人空间地址不一致)</code>这样的网址。</p>
<p>至此,你的gitee的静态页面服务就搭建好了。剩下的就是配置git上传到Gitee的权限了。</p>
<h2 id="ssh配置">SSH配置</h2>
<h3 id="1-本地生成秘钥">1. 本地生成秘钥</h3>
<pre><code class="language-bash">git config --global user.name "yourname"
git config --global user.email "youremail"
ssh-keygen -t rsa -C "youremail"
</code></pre>
<p>默认生成<em>秘钥key</em>在C:\Users\电脑用户名\.ssh文件夹下。</p>
<h3 id="2添加本地秘钥到gitee">2.添加本地秘钥到Gitee</h3>
<p><img src="https://img-blog.csdnimg.cn/20200708114940927.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RhbmllbF93YW5ndA==,size_16,color_FFFFFF,t_70"></p>
<p>在个人设置里,点击SSH公钥,添加公钥,标题自己随便选,公钥就是本地生成的id_rsa.pub里面的内容。</p>
<p>检查下配置是否成功。</p>
<pre><code class="language-bash">ssh -T git@github.com
</code></pre>
<p>配置成功后就可以发布本地生成的博客到Gitee上了。</p>
<h2 id="发布">发布</h2>
<h3 id="1-配置发布地址">1. 配置发布地址</h3>
<p>在hexo初始化的blog的配置文件<code>_config.yml</code>中配置</p>
<pre><code class="language-yaml">deploy:
- type: git
repository: git@gitee.com:{注册的个人空间地址}/{仓库名}.git
branch: master //仓库分支
</code></pre>
<h3 id="2-生成静态文件进行发布">2. 生成静态文件进行发布</h3>
<p>到你本地hexo init blog初始化生成的blog文件夹里,打开Git Base命令窗口。</p>
<ol>
<li>
<p>清除缓存文件 (<code>db.json</code>) 和已生成的静态文件 (<code>public</code>)。</p>
<pre><code class="language-bash">hexo clean
</code></pre>
</li>
<li>
<p>生成静态文件。</p>
<pre><code class="language-bash">hexo generate
</code></pre>
</li>
<li>
<p>文件生成后立即部署网站</p>
<pre><code class="language-bash">hexo deploy
</code></pre>
</li>
</ol>
<p>这个时候本地的内容就部署到了Gitee上了。</p>
<h2 id="gitee-pages更新内容">Gitee Pages更新内容</h2>
<p><img src="https://img-blog.csdnimg.cn/20200708115001191.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RhbmllbF93YW5ndA==,size_16,color_FFFFFF,t_70"></p>
<p>点击更新,然后就可以通过<code>https://{你的个人空间地址}.gitee.io(仓库名跟个人空间地址一致)</code>或者<code>https://{你的个人空间地址}.gitee.io/{你的仓库名}(仓库名跟个人空间地址不一致)</code>访问你的网站了。</p>
<p>至此,你的Hexo到Gitee的部署就实现了!</p><br><br>
来源:https://www.cnblogs.com/chaojilaoshi/p/13266271.html
頁: [1]
查看完整版本: Hexo、Gitee,2020年最新安装部署完整过程