Electron:Electron-builder+Electron-updater 完成Electron应用的自升级

2019/07/19 开坑。

万能的 :checked + label

Meathill：纯 CSS 组件顾名思义，只改变外观，不改变行为。所以它的功能不会因为浏览器变化而变化，即使浏览器支持不完善，即使因为加载速度或者网络关系，导致 CSS、JS 加载失败，它最多样式回归到原始样式，功能是完全一致的。在非标准浏览器环境下，如读屏器，也是如此

前年看肉大直播的时候听到：万能的 :checked + label 当时没有体会到有啥万能，不就是自定义 input 样式吗，直到前段时间看到一个 Demo 虽然不是使用的这种方法，但是我突然就明白了，这个就可以用 :checked + label 来实现。

…

原来很多需要 Js 配合的一些效果点击效果只需要 :checked + label 就可以完成。

阅读全文

BetterScrol 2.x Mouse-whell 没效果

安装

yarn add @better-scroll/mouse-wheel@next

使用

import BScroll from '@better-scroll/core'
import MouseWheel from '@better-scroll/mouse-wheel'
BScroll.use(MouseWheel)

new BScroll('.bs-wrap', {
  //...
  mouseWheel: {
    speed: 20,
    invert: false,
    easeTime: 300
  }
})

但是为什么在原有的基础上这样写没有用呢。官方 Demo

查看 Demo 源码在 scroll-wrapper 外多了一层 core-mouse-wheel 加上就可以了。

😂 没仔细看 Demo 源码

Hexo 主题开发制作

前置

Hexo 的安装就不讲了，直接开始我在制作 Hexo 主题遇到的一些问题。

首先
在使用 Hexo cli 脚手架创建完 Hexo 项目后会有一个默认官方主题 landscape 在 themes 目录中复制一份出来重命名成自己的名称，例如我的就是改成了 yogwang，并且在根目录中的 _config.yml 中修改主题为自己的主题

阅读全文

纯CSS实现瀑布流布局

原理：

  1. column-count: n 将元素中的文本分为 n 列
  2. break-inside: avoid 避免元素内部断行并产生新列
    • 可以不加，但可能会影响布局效果

Demo:

👉 在 CodePen 中打开

阅读全文

Hello Hexo

Hello Hexo,Hello Github Pages

2019.7.9 11:59:16

Chrome下垂直居中容器内区块改变高度使外层容器被移动

问题

在 Chrome 中，使用 transform 或者 flex 垂直居中内容块，当视窗滚动到容器一半时再经过第一个内容块（之后的都正常），整个容器块都会被移动

  • 内容块高度已经大于文本块高度
  • 内容块垂直居中
  • 视窗滚动到容器一半时
  • 改变文本块高度
  • Firefox 同样遇到该问题
  • Edge 正常
  • IE11 正常

问题Gif

阅读全文

Electron_03 - Electron-builder

安装 Electron-builder

$ git clone https://github.com/electron/electron-quick-start

$ cd electron-quick-start

$ yarn add electron-builder --dev // 官方推荐

or

$ npm install elctron-builder --save-dev
阅读全文

Electron_02 - Electron-packager

安装 Electron-packager

需要 Node.js 6.0 或更高版本

npm install electron-packager --save-dev

electron-packager API

使用命令行打包

electron-packager <sourcedir> <appname> --platform=<platform> --arch=<arch> [optional flags...]

必需参数

  • sourcedir - 应用程序源

阅读全文

Electron_01 - 快速启动

自己创建 Electron 应用

1. 使用 npm 初始化一个项目

$ mkdir my-app

$ cd my-app

$ npm init --y
Wrote to E:\my-app\package.json:
{
  "name": "my-app",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}

修改入口文件为 main.js 并且添加 start 脚本引导 Node 来执行 Electron

阅读全文