【个人博客】从零开始建博客（快速教程）

一、Git

（一）定义

• Git 是一个开源的分布式版本控制系统，用于敏捷高效地处理任何或小或大的项目

（二）配置

• 系统运行窗口：win + r => cmd
• 查看 Git 版本

  git --version
  

• 配置账号信息：

  git config --global user.name '你的用户名'
  git config --global user.email '你的邮箱'
  git config --list //查看所有配置
  

（三）区域与状态

1、三种区域

区域	描述	代码
工作区	本地创建的项目目录，文件可进行修改	-
暂存区	已修改的文件快照后提交到暂存区 Index / Stage	git add 文件名
仓库区	保存在暂存区的文件快照永久转存到 Git 仓库	git commit -m ‘备注信息’

2、三种状态

状态	描述	代码
已修改 (modified)	修改了文件，但还没保存到数据库中	-
已暂存 (staged)	对一个已修改文件的当前版本做了标记，使之包含在下次提交的快照中	git add 文件名
已提交 (committed)	数据已经安全的保存在本地 Git 仓库	git commit -m ‘备注信息’

（四）提交代码到本地仓库

目的	代码	备注
初始化文件	git init	在根目录操作
添加文件到暂存区	git add .	添加全部文件到暂存区
添加文件到仓库区	git commit -m ‘备注信息’	添加备注并提交文件到仓库区
查看提交日志	git log	代码回滚参考
查看文件状态	git status -s
查看分支/添加分支	git branch/git branch 分支名
删除本地分支	git branch -D 分支名	切换到其他分支才可删除
切换分支	git checkout
添加并切换分支	git checkout -b 分支名	checkout和branch的合写
分支合并	git merge 分支名	切换到总分支上合并填写名称的分支

（五）提交代码到远程仓库

• 关联远程仓库（GitHub）
• 添加文件到远程仓库

二、代码问题

（一）HTML/CSS

问题	解决方案
字体加粗，hover 抖动	给元素添加长度
设置边框，hover 抖动	给元素添加长度，提前添加透明边框； 给元素添加长度，设置 border-box
无法设置12px 以下字体	使用缩放 transform:scale(calc(目标尺寸/12))
单行文本超出显示省略号	溢出隐藏 overflow: hidden 不换行 white-space: nowrap 省略号 text-overflow: ellipsis
多行文本超出显示省略号	溢出隐藏 overflow: hidden 多行省略号 -webkit-line-clamp: n 盒子属性 display: -webkit-box 单词破坏 word-break: break-all 文字垂直展示 -webkit-box-orient: vertical 注意：不要写 nowrap ！不换行还多行个屁！当场噶过去！

（二）JS

问题	解决方案
Module not found: Error: [CaseSensitivePathsPlugin]	大小写敏感，统一大驼峰格式

（三）VUE

问题	解决方案
router-view 嵌套后点击组件页面为空	对第二个 router-view 顶级路由重定向，子路由path不能加 ‘/’
vue/no-unused-vars 报错	eslint-disable

（四）Element-UI

问题	解决方案
表格内文字居中	style中加上 CSS样式 el-table中加上 header-cell-style和cell-style样式

三、实用工具

类型	工具
快速建站	Hexo
简易markdown	v-md-editor
伪造接口	YAPI