<?xml version="1.0" encoding="utf-8"?>
<feed xmlns="http://www.w3.org/2005/Atom">
  <title>York&#39;s Blog</title>
  
  
  <link href="https://blog.305070.xyz/atom.xml" rel="self"/>
  
  <link href="https://blog.305070.xyz/"/>
  <updated>2024-03-09T13:25:59.681Z</updated>
  <id>https://blog.305070.xyz/</id>
  
  <author>
    <name>York Zhao</name>
    
  </author>
  
  <generator uri="https://hexo.io/">Hexo</generator>
  
  <entry>
    <title>GitHub Actions 自动部署Hexo</title>
    <link href="https://blog.305070.xyz/2024/02/18/github-actions-deploy/"/>
    <id>https://blog.305070.xyz/2024/02/18/github-actions-deploy/</id>
    <published>2024-02-18T15:33:04.000Z</published>
    <updated>2024-03-09T13:25:59.681Z</updated>
    
    <content type="html"><![CDATA[<h2 id="AI总结"><a href="#AI总结" class="headerlink" title="AI总结"></a>AI总结</h2><p>这段文字主要讲述了作者对自动集成与部署（CI&#x2F;CD）在云服务平台中的应用及其体验。以下是主要内容的总结：</p><ol><li><p>作者认为DevOps的重要一环是动集成与部署，特别是在Node.js领域，Vercel、Netlify和CloudFlare Pages已经整合了CI&#x2F;CD，可以减少开发者在编写工作流Yaml文件上的时间，使他们更专注于编码本身。</p></li><li><p>作者尝试使用CloudFlare Pages，但遇到一些问题。特别是当需要跨平台写作，并希望将博客内容上传到GitHub时，CloudFlare Pages并不能像Vercel和Netlify那样直接克隆仓库并构建。在处理同样的错误时，Netlify选择给出警告，而CloudFlare Pages则直接关闭了构建进程。</p></li><li><p>作者提出了一个解决方案，使用GitHub Actions来生成静态文件。他提供了一个Yaml文件，这个文件能够在博客文件上传时自动编译。但是需要注意的是，如果GitHub Actions提交的静态文件触发了push操作，可能会导致问题。因此，他在Yaml文件中对push操作的条件进行了设置，只有在source文件夹有push操作（如新增文章，图片等）或者对主站配置进行更改时，GitHub Actions才会自动生成静态文件并提交。</p></li><li><p>总的来说，作者认为这次的尝试是对CI&#x2F;CD的一次小小的实践，尽管SaaS上的运行肯定会更复杂。他仍希望CloudFlare Pages能够改进其适配性。</p></li></ol><h2 id="序"><a href="#序" class="headerlink" title="序"></a>序</h2><p>(又来用上一篇文章的图了，逃)</p><p>自动集成与部署作为DevOps的重要一环，可以加快应用的发布，部署，等等……</p><p>仅nodejs家族领域，NextJS的爹Vercel，Hexo官方最喜欢的Netlify，以及后起之秀CloudFlare Pages都已经自动集成了CI&#x2F;CD，方便用户少花点时间写那些又臭又长的Workflow Yaml，而<strong>专注于Code本身</strong></p><h2 id="正文"><a href="#正文" class="headerlink" title="正文"></a>正文</h2><h3 id="CloudFlare-Pages（以下简称CF-Pages）败给了前辈"><a href="#CloudFlare-Pages（以下简称CF-Pages）败给了前辈" class="headerlink" title="CloudFlare Pages（以下简称CF Pages）败给了前辈"></a>CloudFlare Pages（以下简称CF Pages）败给了前辈</h3><p>当你真正有一个Cross-Platform写作需求且因此爱上了GitHub时，强大的欲望迫使你把Blog的一切上传到GitHub上。这么大一个公司，依傍在上面何尝不是个好选择（</p><p>恰好的，Vercel和Netlify可以直接clone repo并在自己的那套体系Build好然后交给CDN缓存。</p><p>前者通过识别框架，然后自动部署</p><p>后者则和CF pages一样，<code>npm run build</code>暴力解决</p><p><strong>但</strong>，Netlify<strong>成功</strong>，CF Pages扔出了它的错误。</p><p>通过检查log，来看看两个平台如何处理</p><p><strong>同样的Error</strong></p><p>首先是Netlify</p><figure class="highlight prolog"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><code class="hljs prolog"><span class="hljs-number">7</span>:<span class="hljs-number">07</span>:<span class="hljs-number">07</span> <span class="hljs-symbol">AM</span>: [<span class="hljs-number">3</span>/<span class="hljs-number">4</span>] <span class="hljs-symbol">Linking</span> dependencies...<br><span class="hljs-number">7</span>:<span class="hljs-number">07</span>:<span class="hljs-number">07</span> <span class="hljs-symbol">AM</span>: warning <span class="hljs-string">&quot; &gt; hexo-theme-fluid@1.9.7&quot;</span> has unmet peer dependency <span class="hljs-string">&quot;nunjucks@^3.0.0&quot;</span>.<br><span class="hljs-number">7</span>:<span class="hljs-number">07</span>:<span class="hljs-number">08</span> <span class="hljs-symbol">AM</span>: [<span class="hljs-number">4</span>/<span class="hljs-number">4</span>] <span class="hljs-symbol">Building</span> fresh packages...<br></code></pre></td></tr></table></figure><p>Netlify在根据<code>yarn.lock</code>来安装依赖时，发现了Peer Dependency <code>nunjucks</code>与其它项目依赖版本冲突。具体可查阅相关资料，此处不再赘述。</p><p>在这里，Netlify选择warn一下了事</p><p>反观CloudFlare<br><img src="https://cdn.305070.xyz/pic/2024-02-19/7ee316146c1ae175bfd51fe0017cd559.jpeg" alt="IMG_7439.jpeg"></p><p>CloudFlare贴心的帮我们关掉了Build进程……</p><h3 id="使用GitHub-Actions辅助生成静态文件"><a href="#使用GitHub-Actions辅助生成静态文件" class="headerlink" title="使用GitHub Actions辅助生成静态文件"></a>使用GitHub Actions辅助生成静态文件</h3><blockquote><p>上帝关掉了一扇门，但为你打开了一扇窗</p></blockquote><p>如果你只是来抄作业的，可以将下面的Yaml复制了事</p><p>请记得：<strong>workflow</strong>必须对仓库有写权限，主题配置文件那一栏必须换成你的主题配置文件名</p><figure class="highlight yaml"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br></pre></td><td class="code"><pre><code class="hljs yaml"><span class="hljs-comment"># This is a basic workflow to help you get started with Actions</span><br><br><span class="hljs-attr">name:</span> <span class="hljs-string">CI</span><br><br><span class="hljs-comment"># Controls when the workflow will run</span><br><span class="hljs-attr">on:</span><br>  <span class="hljs-comment"># Triggers the workflow on push or pull request events but only for the &quot;main&quot; branch</span><br>  <span class="hljs-attr">push:</span><br>    <span class="hljs-attr">branches:</span> [ <span class="hljs-string">&quot;main&quot;</span> ]<br>    <span class="hljs-attr">paths:</span> <br>      <span class="hljs-bullet">-</span> <span class="hljs-string">&quot;source/*&quot;</span> <span class="hljs-comment"># source file, includes pages and posts</span><br>      <span class="hljs-bullet">-</span> <span class="hljs-string">&quot;_config.yml&quot;</span> <span class="hljs-comment"># hexo config</span><br>      <span class="hljs-bullet">-</span> <span class="hljs-string">&quot;_config.theme.yml&quot;</span> <span class="hljs-comment"># theme config</span><br>  <span class="hljs-comment">#pull_request:</span><br>  <span class="hljs-comment">#  branches: [ &quot;main&quot; ]</span><br><br>  <span class="hljs-comment"># Allows you to run this workflow manually from the Actions tab</span><br>  <span class="hljs-attr">workflow_dispatch:</span><br><br><span class="hljs-comment"># A workflow run is made up of one or more jobs that can run sequentially or in parallel</span><br><span class="hljs-attr">jobs:</span><br>  <span class="hljs-comment"># This workflow contains a single job called &quot;build&quot;</span><br>  <span class="hljs-attr">build:</span><br>    <span class="hljs-comment"># The type of runner that the job will run on</span><br>    <span class="hljs-attr">runs-on:</span> <span class="hljs-string">ubuntu-latest</span><br><br>    <span class="hljs-comment"># Steps represent a sequence of tasks that will be executed as part of the job</span><br>    <span class="hljs-attr">steps:</span><br>      <span class="hljs-comment"># Checks-out your repository under $GITHUB_WORKSPACE, so your job can access it</span><br>      <span class="hljs-bullet">-</span> <span class="hljs-attr">uses:</span> <span class="hljs-string">actions/checkout@v3</span><br><br>      <span class="hljs-bullet">-</span> <span class="hljs-attr">name:</span> <span class="hljs-string">Setup</span> <span class="hljs-string">Node.js</span> <span class="hljs-string">env</span><br>        <span class="hljs-attr">uses:</span> <span class="hljs-string">actions/setup-node@v4.0.2</span><br>        <span class="hljs-attr">with:</span><br>          <span class="hljs-attr">node-version:</span> <span class="hljs-number">20.11</span><span class="hljs-number">.0</span><br>      <span class="hljs-comment"># Runs a single command using the runners shell</span><br>      <span class="hljs-bullet">-</span> <span class="hljs-attr">name:</span> <span class="hljs-string">Install</span> <span class="hljs-string">Hexo</span><br>        <span class="hljs-attr">run:</span> <span class="hljs-string">sudo</span> <span class="hljs-string">npm</span> <span class="hljs-string">install</span> <span class="hljs-string">hexo</span> <span class="hljs-string">-g</span><br><br>      <span class="hljs-bullet">-</span> <span class="hljs-attr">name:</span> <span class="hljs-string">Install</span> <span class="hljs-string">dependencies</span><br>        <span class="hljs-attr">run:</span> <span class="hljs-string">npm</span> <span class="hljs-string">install</span> <br><br>      <span class="hljs-bullet">-</span> <span class="hljs-attr">name:</span> <span class="hljs-string">Build</span> <span class="hljs-string">static</span> <span class="hljs-string">files</span><br>        <span class="hljs-attr">run:</span> <span class="hljs-string">|</span><br><span class="hljs-string">          hexo clean</span><br><span class="hljs-string">          hexo g</span><br><span class="hljs-string"></span><br>      <span class="hljs-bullet">-</span> <span class="hljs-attr">name:</span> <span class="hljs-string">Push</span> <span class="hljs-string">to</span> <span class="hljs-string">repo</span><br>        <span class="hljs-attr">run:</span> <span class="hljs-string">|</span><br><span class="hljs-string">          git config --global user.email &quot;bot@example.com&quot;</span><br><span class="hljs-string">          git config --global user.name &quot;Auto Push Bot&quot;</span><br><span class="hljs-string">          git add public/</span><br><span class="hljs-string">          git commit -am &quot;Automatic generation by actions&quot;</span><br><span class="hljs-string">          git push</span><br></code></pre></td></tr></table></figure><h3 id="原理"><a href="#原理" class="headerlink" title="原理"></a>原理</h3><p>我们当然希望GitHub Actions在博客全部文件Push时，自动编译。</p><p>但如果GitHub Actions提交上去，在push条件没有设置好时生成的静态文件仍然会触发。所以：</p><p><code>on</code>加上path条件，使actions只有检查到source文件夹有push操作（如新增文章，图片，etc.）或者我们对主站配置进行更改时，GitHub Actions才会自动生成静态文件并提交</p><p>然后是配置nodejs环境。在GitHub Actions中，可以方便地引用官方给出的nodejs环境用法。这里尽量做到与本地环境一致。查询nodejs可以根据底下这样来操作：</p><figure class="highlight crmsh"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><code class="hljs crmsh">$ <span class="hljs-keyword">node</span> <span class="hljs-title">-v</span><br>v20.<span class="hljs-number">11.0</span><br></code></pre></td></tr></table></figure><p>然后就是组合拳，安装依赖，生成静态文件，push。</p><h2 id="总结"><a href="#总结" class="headerlink" title="总结"></a>总结</h2><p>这次GitHub Actions可以算是小小的CI&#x2F;CD实践，当然真正在SaaS上部署肯定更复杂。<br>还是祈求CloudFlare Pages适配吧。</p>]]></content>
    
    
    <summary type="html">这篇文章主要讲述了作者对自动集成与部署（CI/CD）在云服务平台中的应用及其体验。</summary>
    
    
    
    
    <category term="GitHub" scheme="https://blog.305070.xyz/tags/GitHub/"/>
    
    <category term="CI/CD" scheme="https://blog.305070.xyz/tags/CI-CD/"/>
    
  </entry>
  
  <entry>
    <title>Hello, Hexo</title>
    <link href="https://blog.305070.xyz/2024/02/17/Hexo/"/>
    <id>https://blog.305070.xyz/2024/02/17/Hexo/</id>
    <published>2024-02-17T18:49:38.000Z</published>
    <updated>2024-03-09T13:25:59.681Z</updated>
    
    <content type="html"><![CDATA[<h2 id="AI摘要"><a href="#AI摘要" class="headerlink" title="AI摘要"></a>AI摘要</h2><p>这段文字是关于作者在尝试新的博客框架过程中遇到的一些问题和解决方案的记录。主要问题包括：</p><p>1.Wordpress的维护复杂度和对2C1G VPS的占用问题，因此作者尝试新的博客框架。<br>2.在使用Gitpod时，由于新建工作空间时需要绑定一个GitHub仓库，导致初始化IDE时克隆了仓库。解决方案是将.git文件夹移出，完成hexo init后再移回来。<br>3.Cloudflare Pages不支持构建Hexo，解决方案是通过GitHub Actions生成静态文件后，推送到仓库，再由Cloudflare Pages部署。<br>4.GitHub Actions不能推送，主要是写权限问题，git没有添加和设置身份，以及gitignore包含了public&#x2F;，导致Git认为没有更改而没有推送。解决方案是更改这些设置。<br>5.由于只能使用Gitpod写50小时，但作者认为连同GitHub codespaces，这个时间已经足够他使用了。</p><h2 id="序"><a href="#序" class="headerlink" title="序"></a>序</h2><p>由于Wordpress维护的复杂程度及对2C1G VPS致命占用，一次新的博客框架尝试开始了……<br>谨此记录。</p><h2 id="困难"><a href="#困难" class="headerlink" title="困难"></a>困难</h2><h3 id="Not-an-empty-folder"><a href="#Not-an-empty-folder" class="headerlink" title="Not an empty folder"></a>Not an empty folder</h3><p>由于Gitpod在新建Workspace时强制要求绑定一个GitHub repository，导致初始化IDE时clone了repo。<br>但，众所周知，clone下来的repo包含<strong>git</strong>，这是Git用来记录更改和提交的folder，而VSCode是不显示此文件夹。<br><img src="https://cdn.305070.xyz/pic/2024-02-18/f5eb9a6ac08be379786be1c72e44b92a.jpeg" alt="恍惚间，一种掩耳盗铃之美"></p><p>Solution：move .git在文件夹以外，hexo init完再move回来</p><h3 id="Cloudflare-Pages不支持构建Hexo"><a href="#Cloudflare-Pages不支持构建Hexo" class="headerlink" title="Cloudflare Pages不支持构建Hexo"></a>Cloudflare Pages不支持构建Hexo</h3><p>Cloudflare的Pages甚是慷慨，毕竟下面的条件怎么也不像一个亏损多年的公司干出来的事情</p><blockquote><p>无限请求数<br>强大的cdn<br>我是CloudFlare的狗！</p></blockquote><p><strong>But</strong>，CloudFlare也是不支持Hexo，兴许是人家故意屏蔽博客（不过也不像啊）</p><p>Solution：GitHub Actions生成静态文件后，push到仓库，CloudFlare Pages再部署。</p><blockquote><p>但由于文章Push到GitHub会被CloudFlare触发Triggers，故这不太像是一个好主意</p></blockquote><h3 id="GitHub-Actions不能Push"><a href="#GitHub-Actions不能Push" class="headerlink" title="GitHub Actions不能Push"></a>GitHub Actions不能Push</h3><p>1是写权限没给Workflow</p><p>2是git 不add不设置身份</p><p>3是gitignore居然包括了<code>public/</code>导致Git认为无更改从而没有Push</p><blockquote><p>这个错误如果不是上面的Buff叠的压根没有发现</p></blockquote><p>Solution：上面这些Buff否定改成肯定即可。</p><h3 id="Billing"><a href="#Billing" class="headerlink" title="Billing"></a>Billing</h3><p>只能写50hrs的Gitpod。</p><p>不过Gitpod+GitHub codespaces能写很久了。</p><p>我又不是职业作家，要不到720hrs（逃）</p>]]></content>
    
    
    <summary type="html">这篇文章是关于作者在尝试新的博客框架过程中遇到的一些问题和解决方案的记录。</summary>
    
    
    
    
    <category term="Hexo" scheme="https://blog.305070.xyz/tags/Hexo/"/>
    
    <category term="Blog" scheme="https://blog.305070.xyz/tags/Blog/"/>
    
  </entry>
  
</feed>
