人生实验室

# 博客笔记

# vuepress

初始化项目

yarn init -y
# 或者 npm init -y
1
2

https://www.jianshu.com/p/7a2cc8a7f40c 跟着这篇，详细靠谱！

打开终端

mkdir blog 
# 创建博客目录

cd blog 
# 进入目录

yarn add -D vuepress 
# 或 npm i -D vuepress 
# 安装vuepress

mkdir docs 
# 创建文章目录

echo ‘Hello!’ > docs/README.md 
# 编写文章
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

后面说在package.json里面修改，看了半天，原来是要先cd到文件夹里，再执行 npm init -y 来创建一个实例，才有这个package.json， 然后 npm run docs:dev 才能成功起服务。

# 安装yarn

https://www.jianshu.com/p/2220dbacfde1 跟着它

yarn 我也顺便安装下

npm install -g yarn
# 安装yarn

yarn --version
# 查看版本
1
2
3
4
5

yarn 淘宝源安装，分别复制粘贴以下代码行到黑窗口运行即可 ：

yarn config set registry https://registry.npm.taobao.org -g


yarn config set sass_binary_site http://cdn.npm.taobao.org/dist/node-sass -g
1
2
3
4

yarn常用命令

原本装了blog插件捣鼓捣鼓，看了几个大佬的vuepress博客，原始的形式就很好用，似乎还更合适。 卸载blog插件，用最简单的形式做。

npm uninstall -g vue-cli


npm install -g @vue/cli



yarn global remove vue-cli


yarn global add @vue/cli
1
2
3
4
5
6
7
8
9
10
11

# markdown文档

markdown文档：
速查
深入
表情包

目录模板，主要参考https://mulander-j.github.io/fillory/Wiki1001/FAQ/Console/A001.html

# 自动构建部署

git@github.com:guanju/blog-vuepress.git

自动构建部署到github、跳转域名（这位讲得很详细）

https://www.cnblogs.com/softidea/p/10084946.html

这篇讲了PWA配置和自定义页面（conponents）
https://segmentfault.com/a/1190000015237352

# 倒计时js

页面里可以直接写模板和结构

倒计时参考

querySelector()方法学习

var textobj=document.createTextNode("----我是使用原生Js实现的");
pobj.appendChild(strongobj.appendChild(textobj));
上面这个参考：https://www.cnblogs.com/nuanyang76/p/12071442.html
1
2
3

原生js获取当前时间 (https://blog.csdn.net/abcdef12030/article/details/93850338)

  window.onload = function () {

      countDown();

      function addZero(i) {
          return i < 10 ? "0" + i: i + "";
      }

      function countDown() {
			    var nowtime = new Date();
		    	var year = nowtime.getFullYear();
		    	var month = nowtime.getMonth() + 1;
		    	var day = nowtime.getDate();
		    	var hh = nowtime.getHours().toString().padStart(2, 0);
		    	var mm = nowtime.getMinutes().toString().padStart(2, 0);
		    	var ss = nowtime.getSeconds().toString().padStart(2, 0);
		    	var textobj0 = document.createTextNode('现在是 ' + year + ' 年 ' + month + ' 月 ' + day + ' 日 ' + hh + ' 时 ' + mm + ' 分 ' + ss + ' 秒');
          document.querySelector(".time").appendChild(textobj0);

          var endtime = new Date("2021/01/01, 00:00:00");
          var lefttime = parseInt((endtime.getTime() - nowtime.getTime()) / 1000);
          var d = parseInt(lefttime / (24*60*60));
          var h = parseInt(lefttime / (60 * 60) % 24);
          var m = parseInt(lefttime / 60 % 60);
          var s = parseInt(lefttime % 60);
          d = addZero(d);
          h = addZero(h);
          m = addZero(m);
          s = addZero(s);
          var textobj1 = document.createTextNode('离 2021年 还有 '+d+' 天 '+h+' 时 '+m+' 分 '+s+' 秒');
          document.querySelector(".count").appendChild(textobj1);
          if (lefttime <= 0) {
          		var textobj2=document.createTextNode('新年快乐！');
              document.querySelector(".count").appendChild(textobj2);
              return;
          };

          // setTimeout(countDown, 1000);
      }
    }
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40

# 坑

  1. 😢不知道为甚么，我的sidebar出不来………
    找到原因了：
    1.在themeConfig配置里，把sidebar放在nav前面，sidebar出现了。
    2.path不能有中文字符
  2. 下载 md 里面 的 js 要用' 不能用"
    不然在本地看没什么，在 github pages 上线后就会被解析成字符串
    < 和 > 也会被解析
  3. 出现404错误，阅读github pages 文档相关信息后发现，
    在域名服务商里，域名解析 要 cname（指向到git主页地址） 不要 a（数字地址），
    之前看的教程教的是错的。
  4. 新的404（电脑端出现，手机端不出现）
    直接输入lifelonglab.com，找不到服务器 进入guanju.github.io，它会自动跳转到我的域名，这样才会正常显示。应该是只设置了cname的锅吧？ 我加一个A试试，用数字地址，看看这样是不是两个都可以了。 不可以，先放着，就给别人guanju.github.io地址，记录下来，以后有空再解决。

←