去年只有一个 yaml 的文章居然追加了这么多内容?不管怎么样,能多写点东西我是很高兴了。

301 跳转  

这个博客之前的域名是 https://blog.917.moe,现在换成了 https://kwaa.dev
怎么让旧链接跳转呢?我写了一个 Worker 来做这件事。
这里要吹一波 Cloudflare,CDN 和 Worker 都可以免费使用。
虽然原域名过两个月就到期了,能用一会是一会吧。

addEventListener('fetch', event => {
  let url = new URL(event.request.url);
  const redirectTo = 'kwaa.dev';
  url.hostname = redirectTo;
  event.respondWith(
    Response.redirect(url, 301)
  )
})

PWA  

去年还是 manifest.json,今年就变成了 manifest.webmanifest。
新的 maskable_icon 我肯定要用,其他貌似没太大变化?
和上次一样,manifestsw.js 都是我自己写的,没用那些乱七八糟的插件。不过图片缓存不知道为什么无效?以后再改改看吧。

Instant View  

我经常用 Telegram,当然也想让自己的博客能兼容 Instant View。
不过实际上应该说是 Instant View 兼容我的博客?
总之 Theme M 需要写的部分不是很多,下面是本站的模板文件。

~version: "2.1"
body:    //article
cover: $body//div[has-class("mdui-card-media")]//img
channel: "@kwaachannel"
@remove: $body//a[has-class("mdui-btn")]
@remove: $body//a[has-class("mdui-card-primary-title")]
@remove: $body//div[has-class("mdui-card-primary-subtitle")]

My Templates - Instant View 创建新模板,标记十个或更多 URL 后即可提交。

Gulp & Github Actions 自动部署  

kwaa.dev 的配置加入了 gulp ,并且全面更新了依赖版本。
因为 Theme M 设计之初就没有放在本地的 css,js 文件,所以也不需要 gulp-clean-css 和 gulp-uglify。

安装:

npm i gulp -g
npm i gulp gulp-htmlclean gulp-htmlmin gulp-minify-inline
gulp -v

在博客根目录创建 gulpfile.js:

let gulp = require('gulp');
let htmlmin = require('gulp-htmlmin');
let htmlclean = require('gulp-htmlclean');
let minifyInline = require('gulp-minify-inline');

// html
gulp.task('minify-html', function() {
    return gulp
        .src('./public/**/*.html')
        .pipe(htmlclean())
        .pipe(htmlmin({
            removeComments: true,
            minifyJS: true,
            minifyCSS: true,
            minifyURLs: true,
        }))
        .pipe(gulp.dest('./public'))
});
// inline
gulp.task('minify-inline', function() {
    return gulp
        .src('./public/**/*.html')
        .pipe(minifyInline())
        .pipe(gulp.dest('./public'))
});
// task
gulp.task('default', gulp.series(
    'minify-html','minify-inline'
));

创建 ./.github/workflows 文件夹,并新建 main.yml:

name: Build & Deploy ./kwaa.dev
on:
  push:
    branches:
      - master
jobs:
  build-and-deploy:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout
        uses: actions/checkout@v2
      - name: Use Node.js 14.x
        uses: actions/setup-node@v2-beta
        with:
          node-version: '14'
          check-latest: true
      - name: Build
        run: npm i -g hexo gulp && npm install && hexo generate && gulp
      - name: Deploy
        uses: peaceiris/actions-gh-pages@v3
        with:
          github_token: ${{ secrets.GH_TOKEN }}
          publish_branch: gh-pages
          publish_dir: /public
作者:
链接:https://kwaa.dev/p/github-actions-for-hexo/
本文采用 CC BY-NC-SA 4.0 进行许可。
keyboard_arrow_up