文武的编程之路's RSS Feed

docker极速入门

Mon, 22 Jan 2024 03:02:00 GMT

什么是Docker？

Docker是一种容器化技术，以一种与外界环境（容器所在环境）隔离的方式运行应用。

主要优势：

相比其它容器技术，如Vmware的虚拟机技术，Docker的容器技术非常高效，性能接近直接在宿主机运行；
方便部署，由于容器存在隔离性，能够直接避免一些包的版本冲突问题，比如你在电脑直接运行2个运用，一个依赖jdk8，一个依赖jdk11

Docker中的核心概念

容器container

容器是运行的应用

镜像image

镜像是容器形成的基础，镜像运行即形成容器，一个镜像可以以多个容器的方式运行。

Dockerfile

Dockerfile：定义镜像的文件或者定义原代码与镜像的转换。

注意：一个没有后续后缀名的文件

以下为示例：

# Start your image with a node base image
FROM node:18-alpine
# 以node:18-alpine镜像为基础，开始构建镜像

# The /app directory should act as the main application directory
# /app目录作为应用目录
WORKDIR /app

# Copy the app package and package-lock.json file
# 复制项目目标下 package.json、package-lock.json文件到应用目录（./即为 /app）
COPY package*.json ./

# Copy local directories to the current local directory of our docker image (/app)
# 复制项目目录到docker镜像的/app/src，/app/public下
COPY ./src ./src
COPY ./public ./public

# Install node packages, install serve, build the app, and remove dependencies at the end
# 安装node依赖包，安装serve包，运行构建完成后，并删除构建包目录（node_modules）
RUN npm install \
    && npm install -g serve \
    && npm run build \
    && rm -fr node_modules

# 容器内部运行时使用3000，将该端口与外部环境关联，从而访问容器应用
EXPOSE 3000

# Start the app using serve command
# 使用serve -s build启用这容器应用
CMD [ "serve", "-s", "build" ]

构建一个镜像

docker build -t my-docker:lates .

运行一个镜像

docker run -p 127.0.0.1:8000:8000 my-docker:latest

docker常用的命令docker cli

docker可以制作镜像，镜像运行可以产生1-n运行的容器。

因此，镜像、容器也需要管理，以下是一些常用的命令

命令	说明
docker ps	查看运行的容器
docker rm [-f] containerId	删除容器，-f时，可以直接删除在运行的容器
docker inspect	查看容器详细信息
docker logs	查看容器运行日志
docker exec containerId /bin/bash	进入容器，如直接更改镜像中文件内容
docker images	查看镜像
docker rmi [imageId]	通过镜像id，tag，tag:version皆可删除镜像
docker search	查看某个镜像

以类Github的视角看docker

docker可以制作镜像，开发时，就可以直接基于原有镜像进行开发。

docker也形成的自己的中央仓库，即类似github一样，有许多机构、开发人员上传自己制作的镜像、其它人可以查找、拉取镜像为已所用。

windows命令速查表

Sun, 24 Dec 2023 09:33:00 GMT

文件的创建、内容查看、内容查找

命令	说明
echo "hello huangwenwu.com" > test.txt	创建test.txt文件，将"hello huangwenwu.com"输入到文件中
del [文件名]	删除文件
type [文件名]	显示文件内容
more [文件名]	逐屏显示文件内容
find "[搜索字符串]" [文件名]	查找文件中字符串 TODO:
notepad [文件名]	记事本打开文件（修改）
rename [文件名1] [文件名2]	重命名，使用时可简写为ren

文件夹（目录）切换、创建、查看、窗口打开

命令	说明
cd [目录路径]	切换目录
mkdir [目录名称]	创建目录
rd /S [目录名]	删除目录，以及文件；添加 /Q 参数后，表示静默删除，无需确定
dir	列出目录内容
tree	以树形结构显示目录
explorer [目录路径]	以窗口打开文件夹
资源管理器关闭	`taskkill /f /im explorer.exe`
资源管理器重启	`start explorer`。场景，如windows上桌面图标等不显示了

文件和目录

复制

命令	说明
copy [源文件] [目标目录]	复制文件到目录
xcopy [源路径] [目标路径] /E	复制文件和目录及其子目录
robocopy [源路径] [目标路径] /E	强大的文件复制工具

三者区别：功能上包含关系 robocopy > xcopy > copy

当copy到不存在的目录时会显示找不到路径，而xcopy可以创建不存在的目录，可以复制文件夹，也可以只复制文件夹结构。
robocopy除了xcopy的所有功能，还能多线程复制、移动文件、文件夹，可以指定文件时间范围，支持多项通配符文件

移动文件和目录

命令	说明
move [源路径] [目标路径]	移动文件或目录

文件压缩和解压缩

命令	说明
tar -cf xxx.tar.gz ./xxx	压缩
tar -xf xxx.tar.gz	解压
Compress-Archive -Path [源路径] -DestinationPath [目标路径]	压缩
Expand-Archive -Path [压缩文件] -DestinationPath [解压路径]	解压

tar使用关键参数：

t 显示档案文件列表内容；
x 解压档案文件;
c 生成档案文件，创建打包文件；
z 是将文件进行压缩，z代表压缩类型为.gzip文件格式；
f 指定档案文件名称，f必须放在命令参数最后；
-C 是指定解压缩文件的存放位置，不写的话，默认是当前目录下 |

应用程序和进程

命令	说明
start [应用程序路径] [文件路径]	启动应用程序或打开文件
tasklist	列出运行中的进程
taskkill /F /PID [进程ID]	结束进程 TODO:
msconfig	系统配置实用程序
taskmgr	任务管理器

系统设置

命令	说明
control	打开控制面板
mstsc	远程桌面连接
appwiz.cpl	控制面板中的“程序和功能
powercfg.cpl	控制面板中的“电源选项”
firewall.cpl	控制面板中的“Windows防火墙”
control.exe /name Microsoft.NetworkAndSharingCenter	控制面板中的“网络和共享中心”
control netconnections	打开网络和共享中心
ncpa.cpl	同上
systempropertiesadvanced	打开高级系统设置
gpedit.msc	组策略编辑器
regedit	注册表编辑器
systeminfo	查看windows系统信息
msinfo32	查看系统详细信息，以打开窗口打开形式
osk	打开屏幕键盘
slui	查看系统激活
timedate.cpl	日期与时间设置

.cpl是控制面板扩展（Control Panel extension）的缩写

网络设置和工具

命令	说明
ipconfig	显示网络配置信息
netsh interface show interface	网络shell命令查看网络接口
netsh firewall show state	查看防火墙状态
nslookup [域名或IP地址]	域名系统查询工具

其他实用命令

帮助（指令列表，及简单解释）

命令	说明
help	查看指令列表，以及简要解释
help <命令名称>	查看说明或者 <命令>/?

关机和重启计算机

命令	说明
shutdown -s -t 0	关机 -s shutdwon; -t "time-out perirod"关机前停留时长，单位秒
shutdown -h	休眠（-h hibernate），电脑将处于断电状态，数据保持到硬盘中
shutdown -r	重启（-r reboot）

打开系统内置应用

命令	说明
calc	打开计算器
notepad	打开记事本
mspaint	打开画图工具

cmd命令行

Win + r 打开cmd命令行会窗口，以下为输入到cmd命令行窗口中的命令

命令	说明
powershell	打开powerShell窗口，拥有包括cmd的功能，及更多功能
shell:startup	打开放置开机自启的应用文件夹
%localappdata%\Packages\Microsoft.Windows.ContentDeliveryManager_cw5n1h2txyewy\LocalState\Assets	打开windows登录时壁纸文件夹

快捷打开环境变量窗口

命令	说明
cmd中,sysdm.cpl	Win + r，打开cmd命令行，输入sysdm.cpl，弹窗中选择“高级”-“环境变量”

查看环境变量值

环境变量 LOCALAPPDATA - 表示app数据存放位置

命令	说明
cmd中, echo %LOCALAPPDATA%	打开cmd命令行窗口，快捷方式，win + r，输入cmd回车
powershell中, $env:LOCALAPPDATA	打开powershell命令行，开始菜单搜索powershell即可

上述的 LOCALAPPDATA，小写为localappdata，依然可行

参考文章

web前端开发的代码下载及npm包安装

Tue, 19 Dec 2023 13:53:00 GMT

web前端开发的代码下载及包安装

下载代码仓库 git clone xx
安装依赖包 npm / yarn

由于网络原因，可能出现无法下载的情况：如npm install安装

从github下载的解决方案

github下载失败往往是间歇性的，某段时间突然就不行，或许过一会就可以下载成功了（类似于github有时可打开，有时无法访问一样）。

方案一：配置代理（依然从github源下载）

由于是我们受限访问，因此可以通过设置代理来下载资源我 -> 代理（可以正常访问github） -> github

一种是全局代理，一种是局部代理

配置全局代理

# 设置HTTP代理
$ git config --global http.proxy <http_proxy>
# 设置HTTPS代理
$ git config --global https.proxy <https_proxy>

其中<http_proxy>为HTTP代理地址，格式为host:port； <https_proxy>为HTTPS代理地址，也需要指定主机名和端口号。

示例

git config --global http.proxy 127.0.0.1:8888
// 或
git config --global http.proxy 用户名:密码@代理地址:端口号

验证是否配置成功

$ git config --list
……
http.proxy=http://127.0.0.1:7890
……
https.proxy=http://127.0.0.1:7890

或者

git config --global --get http.proxy

取消代理

git config --global --unset http.proxy
git config --global --unset https.proxy

只针对特定的远程库设置代理（不使用--global修饰）首先克隆该远程库到本地，然后切换到该目录下，并运行以下命令来设置代理：

# 设置HTTP代理
$ git config http.proxy <http_proxy>
# 设置HTTPS代理
$ git config https.proxy <https_proxy>

这样就会将当前目录下的远程库与代理关联起来了。

方案二从gitee下载

先将github仓库clone到gitee，再从gitee上下载

gitee官网，点击右上角“+”按钮，选择“ 从 GitHub / GitLab 导入仓库”
“Git 仓库 URL”，填入github库地址，确定导入即可

后续从gitee上clone即可

其它

由于通常是间歇性无法访问，也可以通过多次尝试，或者切换成手机网络进行尝试；
使用其它镜像站，如https://gitclone.com/；https://hub.nuaa.cf/
使用github代码选项的"Dwonload ZIP"，有时也是可行的；使用ssh协议进行clone时，需要在github设置中，配置ssh。

npm

npm install 卡在

idealTree: timing idealTreee Completed in ...

一直在等待，通常也是网络问题

设置淘宝源（最常见的解决方式）

npm config set registry https://registry.npm.taobao.org

查看设置：

npm config get registry

设置官方镜像源：

npm config set registry https://registry.npmjs.org

注意： 确实下载很快，但是有时候似乎一些包匹配的下载有问题，看着也安装成功了，但是npm run dev出现问题

源管理工具 nrm

npm install -g nrm

nrm ls
  npm ---------- https://registry.npmjs.org/
  yarn --------- https://registry.yarnpkg.com/
  tencent ------ https://mirrors.cloud.tencent.com/npm/
  cnpm --------- https://r.cnpmjs.org/
* taobao ------- https://registry.npmmirror.com/
  npmMirror ---- https://skimdb.npmjs.com/registry/


//如果使用nrm ls发现全面都没有带*，则可以参考最后面的教程

//切换镜像源命令
nrm use xxx  //例：nrm use taobao 就可以切换自己想用的镜像源了

//当前使用的源
nrm current

// 添加源
nrm add ustc https://npmreg.proxy.ustclug.org/

其它源

中国科学大学 https://npmreg.proxy.ustclug.org/

参考文章

vim配置速查表

Mon, 11 Dec 2023 03:02:00 GMT

行号number

配置项	说明
:set number	显示行号
:set nonumber	不显示行号
:set nu!	不显示行号，更简易的方式
:set relativenumber	显示相对行号，以当前鼠标行号作基数（0）
:set rnu	显示相对行号
:set nu! rnu!	同时多种行号
:set numberwidth = 10	设置行号占据的宽度

number可以简写为nu

tab键

配置项	说明
:set tabstop=8	设置按下tab键时，空格为4个。默认为8个空格。
:expandtab	TODO
:set softtabstop=8	TODO

高亮highlight

配置项	说明
:highlight ExtraWhitespace ctermbg=red guibg=red	高亮尾部空格
:match ExtraWhitespace /\s+$/	TODO
:autocmd BufWinEnter * match ExtraWhitespace /\s+$/	TODO
:autocmd InsertEnter * match ExtraWhitespace /\s+%#@<!$/	TODO
:autocmd InsertLeave * match ExtraWhitespace /\s+$	TODO
:autocmd BufWinLeave * call clearmatches()	TODO
:highlight LineNr ctermfg=red ctermbg=none	高亮行号
:set hlsearch	高亮搜索
:set hlsearch!	高亮搜索关闭
:set nohlsearch	高亮搜索关闭

大小写

配置项	说明
:set ignorecase	查找时不考虑大小写
:set noignorecase	查找时考虑大小写
:set cindent	专门用于c语言的缩进

ignorecase可以简写ic noignorecase可以简写为 nic

缩进

配置项	说明
:set autoindent	缩进
:set smartindent	智能缩进
:set cindent	专门用于c语言的缩进

autoindent可以简写为 ai smartindent可以简写 si cident可以简写 ci

在vi中自动缩进的选项一般有以下的几种：

autoindent: 在这种缩进形式中，新增加的行和前一行有相同的缩进形式。

smartindent: 在这种缩进模式中，每一行都和前一行有相同的缩进量，同时能够正确的识别出{和}，当遇到右花括号（}），则取消了缩进形式。此外还增加了识别C语言关键字的功能。如果一行是以#开头的，那么这种格式将会被特殊对待而不采用缩进格式。这种缩进格式强于autoindent。

cindent：这是C语言的缩进形式，采用这样的缩进方式的程序语言有：C，C++,Java等。当采用这种缩进格式时，vi就会自动的采用标准的C语言形式。这种缩进格式强于smartindent。

折叠fold

配置项	说明
:set nofoldenable	禁用所有折叠
:set foldmethod=indent	设置以缩进作为折叠依据
:set foldmethod=marker	设置以标记作为折叠依据
:set foldmethod=syntax	设置以语法作为折叠依据

光标线展示

配置项	说明
:set cul	显示光标所在行 cul即 cursor line
:set cuc	显示光标所在列 cuc即 curosr column

主题colorscheme

配置项	说明
:colorscheme	回车：展示当前使用主题
:colorscheme	Ctrl + d：列出所有可用主题
:colorscheme slate	使用某个主题，其中slate是主题名称

上面的colorscheme，可以简写为color

可选主题：

blue delek evening morning peachpuff slate default elflord koehler pablo shine zellner

多窗口显示

配置项	说明
set splitright	左右分离后，鼠标显示在新窗口
set splitbelow	上下分离后，鼠标显示在新窗口

其它

配置项	说明
:h 'number'	查看配置参数
:set all	显示所有可配置项
:set term	设置终端情况
:set shiftwidth=4	借助 < 或 > 进行缩进时的距离
:set wrapmargin=20	设置右边距为20个字符
:set ruler	在右下角显示行与列
:set ignorecase	忽略大小写 TODO
:syntax on	语法高亮 -- 前面不需要使用set
:set nomagic	TODO

Getting Started

Sun, 01 Mar 2020 03:00:00 GMT

Add Post

Set Front matter

---
title: "Getting Started"  // Post title
category: "Instruction"   // Post category
date: "2020-03-01 12:00:00 +09:00"  // Current time
desc: "Let's start making blogs step by step!"  // Post desc
thumbnail: "./images/getting-started/thumbnail.jpg" // Post thumbnail
alt: "apple and shaking hands"  // [optional] thumbnail image alt
---

NOTE : Properties other than alt must be required.

Edit About Page

Easy. You can modify the blog/about.md file. If you need additional styling, give an id or class to a specific element in about.md and try to control it in the pages/about.js file.

An example is shown below.

blog/about.md

<h2 id="title">Hello</h2>

pages/about.js

const About = () => {
  /* ... */
}

const Container = styled(Markdown).attrs({
  as: "main",
})`
  width: var(--post-width);
  margin: 0 auto;
  margin-top: 80px;
  margin-bottom: 6rem;

  @media (max-width: ${({ theme }) => theme.device.sm}) {
    margin-top: var(--sizing-xl);
    width: 87.5%;
  }

  h1 {
    margin-bottom: 2rem;
  }

  h2 {
    margin-top: var(--sizing-lg);

    @media (max-width: ${({ theme }) => theme.device.sm}) {
      font-size: 1.75rem;
    }
  }

  h3 {
    @media (max-width: ${({ theme }) => theme.device.sm}) {
      font-size: 1.25rem;
    }
  }

  /* You can Add Additional Styling here */

  #title {
    font-size: 60px;
  }
`

export default About

Other Customization

You can freely customize each componentfile using the styled-component. If you want to change the style globally, you can change the styles/globalStyle file.

Thank you for using gatsby-starter-apple. If you have any questions, please leave them on this link.

Code Highlight

Sat, 01 Feb 2020 03:00:00 GMT

Using Plugin

This starter kit uses the code highlight plugin gatsby-remark-vscode. Please refer to the link for more detailed instructions. It's a great plugin. 👍

React JSX with line highlighting

var ProfileLink = React.createClass({
  render: function () {
    return (
      <a href={"https://www.facebook.com/" + this.props.username}>
        {this.props.username}
      </a>
    )
  },
})

Javascript

import {x, y} as p from 'point';
const ANSWER = 42;

class Car extends Vehicle {
  constructor(speed, cost) {
    super(speed);

    var c = Symbol('cost');
    this[c] = cost;

    this.intro = `This is a car runs at
      ${speed}.`;
  }
}

for (let num of [1, 2, 3]) {
  console.log(num + 0b111110111);
}

function $initHighlight(block, flags) {
  try {
    if (block.className.search(/\bno\-highlight\b/) != -1)
      return processBlock(block.function, true, 0x0F) + ' class=""';
  } catch (e) {
    /*handle exception*/
        var e4x =
        <div>Example
            <p>1234</p></div>;
  }
  for (var i = 0 / 2; i < classes.length; i++) {
  // "0 / 2" should not be parsed as regexp
    if (checkCondition(classes[i]) === undefined)
      return /\d+[\s/]/g;
  }
  console.log(Array.every(classes, Boolean));
}

export  $initHighlight;

HTML

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>Hello world</title>
    <link
      href="http://fonts.googleapis.com/css?family=Roboto:400,400italic,700,700italic"
      rel="stylesheet"
      type="text/css"
    />
    <link rel="stylesheet" href="index.css" />
  </head>
  <body>
    <div id="app"></div>
    <script src="//cdnjs.cloudflare.com/ajax/libs/less.js/2.5.1/less.min.js"></script>
    <script src="vendor/prism.js"></script>
    <script src="examples.bundle.js"></script>
  </body>
</html>

CSS

pre[class*="language-"],
code {
  color: #5c6e74;
  font-size: 13px;
  text-shadow: none;
  font-family: Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace;
  direction: ltr;
  text-align: left;
  white-space: pre;
  word-spacing: normal;
  word-break: normal;
  line-height: 1.5;
  tab-size: 4;
  hyphens: none;
}
pre[class*="language-"]::selection,
code::selection {
  text-shadow: none;
  background: #b3d4fc;
}
@media print {
  pre[class*="language-"],
  code {
    text-shadow: none;
  }
}
pre[class*="language-"] {
  padding: 1em;
  margin: 0.5em 0;
  overflow: auto;
  background: #f8f5ec;
}
:not(pre) > code {
  padding: 0.1em 0.3em;
  border-radius: 0.3em;
  color: #db4c69;
  background: #f9f2f4;
}

Markdown Test

Sun, 01 Dec 2019 03:00:00 GMT

Overview

Philosophy

Markdown is intended to be as easy-to-read and easy-to-write as is feasible.

Readability, however, is emphasized above all else. A Markdown-formatted document should be publishable as-is, as plain text, without looking like it's been marked up with tags or formatting instructions. While Markdown's syntax has been influenced by several existing text-to-HTML filters -- including Setext, atx, Textile, reStructuredText, Grutatext, and EtText -- the single biggest source of inspiration for Markdown's syntax is the format of plain text email.

Block Elements

Paragraphs and Line Breaks

A paragraph is simply one or more consecutive lines of text, separated by one or more blank lines. (A blank line is any line that looks like a blank line -- a line containing nothing but spaces or tabs is considered blank.) Normal paragraphs should not be indented with spaces or tabs.

The implication of the "one or more consecutive lines of text" rule is that Markdown supports "hard-wrapped" text paragraphs. This differs significantly from most other text-to-HTML formatters (including Movable Type's "Convert Line Breaks" option) which translate every line break character in a paragraph into a <br /> tag.

When you do want to insert a <br /> break tag using Markdown, you end a line with two or more spaces, then type return.

Headers

Markdown supports two styles of headers, [Setext] [1] and [atx] [2].

Optionally, you may "close" atx-style headers. This is purely cosmetic -- you can use this if you think it looks better. The closing hashes don't even need to match the number of hashes used to open the header. (The number of opening hashes determines the header level.)

Blockquotes

Markdown uses email-style > characters for blockquoting. If you're familiar with quoting passages of text in an email message, then you know how to create a blockquote in Markdown. It looks best if you hard wrap the text and put a > before every line:

This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus. Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.

Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse id sem consectetuer libero luctus adipiscing.

Markdown allows you to be lazy and only put the > before the first line of a hard-wrapped paragraph:

This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus. Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus. Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse id sem consectetuer libero luctus adipiscing.

Blockquotes can be nested (i.e. a blockquote-in-a-blockquote) by adding additional levels of >:

This is the first level of quoting.

This is nested blockquote.

Back to the first level.

Blockquotes can contain other Markdown elements, including headers, lists, and code blocks:

This is a header

This is the first list item.

This is the second list item.

Here's some example code:
return shell_exec("echo $input | $markdown_script");

Any decent text editor should make email-style quoting easy. For example, with BBEdit, you can make a selection and choose Increase Quote Level from the Text menu.

Lists

Markdown supports ordered (numbered) and unordered (bulleted) lists.

Unordered lists use asterisks, pluses, and hyphens -- interchangably -- as list markers:

Red
Green
Blue

is equivalent to:

Red
Green
Blue

and:

Red
Green
Blue

Ordered lists use numbers followed by periods:

Bird
McHale
Parish

It's important to note that the actual numbers you use to mark the list have no effect on the HTML output Markdown produces. The HTML Markdown produces from the above list is:

If you instead wrote the list in Markdown like this:

Bird
McHale
Parish

or even:

Bird
McHale
Parish

you'd get the exact same HTML output. The point is, if you want to, you can use ordinal numbers in your ordered Markdown lists, so that the numbers in your source match the numbers in your published HTML. But if you want to be lazy, you don't have to.

To make lists look nice, you can wrap items with hanging indents:

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus. Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.
Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse id sem consectetuer libero luctus adipiscing.

But if you want to be lazy, you don't have to:

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus. Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.
Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse id sem consectetuer libero luctus adipiscing.

List items may consist of multiple paragraphs. Each subsequent paragraph in a list item must be indented by either 4 spaces or one tab:

This is a list item with two paragraphs. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus.

Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus. Donec sit amet nisl. Aliquam semper ipsum sit amet velit.
Suspendisse id sem consectetuer libero luctus adipiscing.

It looks nice if you indent every line of the subsequent paragraphs, but here again, Markdown will allow you to be lazy:

This is a list item with two paragraphs.
```
This is the second paragraph in the list item. You're
```
only required to indent the first line. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Another item in the same list.

To put a blockquote within a list item, the blockquote's > delimiters need to be indented:

A list item with a blockquote:

This is a blockquote inside a list item.

To put a code block within a list item, the code block needs to be indented twice -- 8 spaces or two tabs:

A list item with a code block:
```
  <code goes here>
```

Code Blocks

Pre-formatted code blocks are used for writing about programming or markup source code. Rather than forming normal paragraphs, the lines of a code block are interpreted literally. Markdown wraps a code block in both <pre> and <code> tags.

To produce a code block in Markdown, simply indent every line of the block by at least 4 spaces or 1 tab.

This is a normal paragraph:

This is a code block.

Here is an example of AppleScript:

tell application "Foo"
    beep
end tell

A code block continues until it reaches a line that is not indented (or the end of the article).

Within a code block, ampersands (&) and angle brackets (< and >) are automatically converted into HTML entities. This makes it very easy to include example HTML source code using Markdown -- just paste it and indent it, and Markdown will handle the hassle of encoding the ampersands and angle brackets. For example, this:

<div class="footer">
    &copy; 2004 Foo Corporation
</div>

Regular Markdown syntax is not processed within code blocks. E.g., asterisks are just literal asterisks within a code block. This means it's also easy to use Markdown to write about Markdown's own syntax.

tell application "Foo"
    beep
end tell

Span Elements

Links

Markdown supports two style of links: inline and reference.

In both styles, the link text is delimited by [square brackets].

To create an inline link, use a set of regular parentheses immediately after the link text's closing square bracket. Inside the parentheses, put the URL where you want the link to point, along with an optional title for the link, surrounded in quotes. For example:

This is an example inline link.

This link has no title attribute.

Emphasis

Markdown treats asterisks (*) and underscores (_) as indicators of emphasis. Text wrapped with one * or _ will be wrapped with an HTML <em> tag; double *'s or _'s will be wrapped with an HTML <strong> tag. E.g., this input:

single asterisks

single underscores

double asterisks

double underscores

Code

To indicate a span of code, wrap it with backtick quotes (`). Unlike a pre-formatted code block, a code span indicates code within a normal paragraph. For example:

Use the printf() function.

Table

配置项	说明
:set number	显示行号
:set nonumber	不显示行号

文武的编程之路's RSS Feed

docker极速入门

什么是Docker？

Docker中的核心概念

容器container

镜像image

Dockerfile

构建一个镜像

运行一个镜像

docker常用的命令docker cli

以类Github的视角看docker

windows命令速查表

文件的创建、内容查看、内容查找

文件夹（目录）切换、创建、查看、窗口打开

文件和目录

复制

移动文件和目录

文件压缩和解压缩

应用程序和进程

系统设置

网络设置和工具

其他实用命令

帮助（指令列表，及简单解释）

关机和重启计算机

打开系统内置应用

cmd命令行

快捷打开环境变量窗口

查看环境变量值

参考文章

web前端开发的代码下载及npm包安装

web前端开发的代码下载及包安装

从github下载的解决方案

方案一：配置代理（依然从github源下载）

方案二 从gitee下载

其它

npm

设置淘宝源（最常见的解决方式）

源管理工具 nrm

其它源

参考文章

vim配置速查表

行号number

tab键

高亮highlight

大小写

缩进

折叠fold

光标线展示

主题colorscheme

多窗口显示

其它

Getting Started

Add Post

Set Front matter

Edit About Page

blog/about.md

pages/about.js

Other Customization

Code Highlight

Using Plugin

React JSX with line highlighting

Javascript

HTML

CSS

Markdown Test

Overview

Philosophy

Block Elements

Paragraphs and Line Breaks

Headers

Blockquotes

This is a header

Lists

Code Blocks

Span Elements

Links

Emphasis

Code

Table

方案二从gitee下载