使用 VS Code + Markdown 編寫 PDF 文檔

1

背景介紹? ? ? ?

作為一個技術人員,基本都需要編寫技術相關文檔,而且大部分技術人員都應該掌握 Markdown 這個技能,使用 Markdown 來編寫并生成 PDF 文檔將會是一個不錯的體驗,以下就介紹下如何使用 VS Code + Markdown 來編寫 PDF?文檔。

2

效果演示? ? ? ?

312ee9e5eb4369f69ed6bc0c1e990ef0.png

131a39399a0f543247369c71907b999a.png

8800ba571bb9bc0be5d3d36a1277f1e4.png

3

環境準備? ? ? ?

  • [必須]?安裝 Visual Studio Code

35286613550f17ea91059223378ae8a9.png

  • [必須]?安裝 Extension - Markdown PDF,主要用于生成 PDF

65e47af7e8c1a41cbdc87db606958297.png

  • [可選]?安裝 Extension - markdownlint,用于 markdown 語法提示

2443421886fb50aa7922b910a1fa4949.png

4

使用指引? ? ? ?

1.?打開預覽

使用 Ctrl+Shift+V 熱鍵打開文檔 Preview

bfeb775c179837511115968a654da44a.png

2.?文本內容

## 文本內容- 字體我是普通字體- 斜體*我是斜體*- 粗體**我是粗體**- 粗斜體***我是粗斜體***- 刪除線~~我是刪除線~~

3cc79d5301a0cff05efaa4bc75d90ff7.png

3.?超鏈接

## 超鏈接- [GitHub](https://github.com/)- <https://github.com/>

2e8348915ccc12f97c2f56e9ae15e201.png

4.?圖片

## 圖片![圖片](image.png "圖片")

3013a9c717beaf5be19369119d5a34ff.png

5.?代碼塊

## 代碼塊- 行內式演示各種編程語言的 `Hello World` 程序- Java```javapublic class HelloWorld  
{  public static void main(String[] args)  {    System.out.println("Hello,World!");  }  }  ```- C```c#include <stdio.h>  int main(){  printf("Hello,World!");return 1;}```- C++```cpp#include <iostream>  #include <stdio.h>int main()  {  printf("Hello,World!--Way 1\n");  puts("Hello,World!--Way 2");  puts("Hello," " " "World!--Way 3");  std::cout << "Hello,World!--Way 4" << std::endl;  return 1;  } ```- Python```pythonprint "Hello,World!"   #Python 2.xprint("Hello,World!")  #Python 3.x```- C#```csharpusing System;  class TestApp  
{  public static void Main()  {  Console.WriteLine("Hello,World!");  Console.ReadKey();  }  } ```- Shell```bashecho "Hello,World!"```

fda7c4c2a9731229dcdb39798c3278d1.png

6.?列表

## 列表### 無序列表- 第一項
- 第二項
- 第三項### 有序列表1. 第一項
2. 第二項
3. 第三項### 任務列表- [x] 吃飯
- [x] 睡覺
- [ ] 寫代碼

f0666f0a244984b2889f748636857842.png

7.?引用

## 引用### 并列> 引用1  
> 引用2  
> 引用3  ### 嵌套> 第一層嵌套
>> 第二層嵌套  
>>>>> 第五層嵌套### 引用中使用列表> 引用
>
> 1. 第一項
> 2. 第二項
>
> - 第一項
> - 第二項
> - 第三項### 列表中使用引用- 第一項> 引用1  > 引用2
- 第二項

0aca84fbbc5d1f23d07d0316b25aa077.png

8.?表格

## 表格| 默認對齊 | 居左對齊 | 居右對齊 | 居中對齊 |
| ------- | :------- | ------: | :-----: |
| 單元格 | 單元格 | 單元格 | 單元格 |
| 單元格 | 單元格 | 單元格 | 單元格 |

850ca3a5f56545a797f1ce60b3709638.png

9.?UML

## UML- markdown-it-plantuml無法預覽,項目地址:<https://github.com/gmunguia/markdown-it-plantuml>@startuml
Bob -[#red]> Alice : hello
Alice -[#0000FF]->Bob : ok
@enduml- mermaid無法預覽,項目地址:<https://mermaid-js.github.io/mermaid/#/>```mermaid
erDiagramCUSTOMER ||--o{ ORDER : placesORDER ||--|{ LINE-ITEM : containsCUSTOMER }|..|{ DELIVERY-ADDRESS : uses
```

c3c556155cdb87be81ed505edb9f2ee4.png

69c593b3fa5f554e3162b5650052c038.png

10.?公式

## 公式使用 LaTeX 語法,僅支持預覽,不支持 pdf,需要先手動轉換成圖片或文本。- 梯度下降的數學公式$$\theta_{n+1} = \theta_{n} - \eta \cdot \nabla J(\theta) \tag{1}$$
其中:$\theta_{n+1}$:下一個值$\theta_n$:當前值$-$:減號,梯度的反向$\eta$:學習率或步長,控制每一步走的距離,不要太快以免錯過了最佳景點,不要太慢以免時間太長$\nabla$:梯度,函數當前位置的最快上升點$J(\theta)$:函數- 均方差函數$$ loss = {1 \over 2}(z-y)^2 \tag{單樣本} $$$$ J=\frac{1}{2m} \sum_{i=1}^m (z_i-y_i)^2 \tag{多樣本} $$

074fa9579f1763775b406a8becaca3a4.png

11.?強制換頁

使用自動換頁有時會不合理低把內容分到不同的頁碼,使用以下代碼可以強制換頁,美化 PDF 排版。

<div style="page-break-after: always"></div>

5

生成文檔? ? ? ?

在 markdown 文件窗口右鍵選擇 Markdown PDF: Export {pdf} 生成 PDF。

fed740467c1a24b951e789c093fca95f.png

6

參考總結? ? ? ?

以上就是本文希望分享的內容,如果大家有什么問題,歡迎在公眾號 - 跬步之巔留言交流。

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/287392.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/287392.shtml
英文地址,請注明出處:http://en.pswp.cn/news/287392.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

《看聊天記錄都學不會C語言?太菜了吧》(6)編程很難嗎?差一點就學不會了呢!

若是大一學子或者是真心想學習剛入門的小伙伴可以私聊我&#xff0c;若你是真心學習可以送你書籍&#xff0c;指導你學習&#xff0c;給予你目標方向的學習路線&#xff0c;無套路&#xff0c;博客為證。 本系列文章將會以通俗易懂的對話方式進行教學&#xff0c;對話中將涵蓋…

【ArcGIS風暴】氣象臺站氣溫(降水)矢量數據插值成柵格氣溫(降水)空間數據

關于文本格式的氣象數據生成Shapefile矢量數據的過程,可以參照文章《ArcGIS 10.2導入Excel數據X、Y坐標(經緯度、平面坐標),生成Shapefile點數據圖層》。本文在前面生成的具有氣溫和降水屬性的氣象臺站矢量數據的基礎上,通過柵格插值,柵格裁剪等過程生成空間分布的氣溫和…

時間差幾天 php,計算和當前時間差多少天

我們有時在做網站時會碰到比較特別的需求&#xff0c;一條信息顯示是幾天和幾天后的或者一個月前的&#xff0c;上次做一個APP時就碰到了這周情況&#xff0c;留下當時用的代碼以便以后用時不需要東奔西走。PHP代碼&#xff1a;function calcTime($time){$now time(); //當前時…

Android studio之導入新庫提示Add library ‘Gradle*****@aar‘ to classpath

1 問題 as導入第三方庫在依賴的基類build.gradle里面添加如下 implementation com.truizlop.sectionedrecyclerview:library:1.2.0 提示錯誤如下 2 原因 implementation 單層引用&#xff0c;只引用當前aar包層&#xff0c; api 多層引用&#xff0c;引用當前aar包層&#…

Windows 查看端口占用

查看 Windows 端口占用情況 在 Windows 命令行窗口下執行一下命令 查看所有端口占用情況netstat -ano 查看特定端口的占用情況netstat -aon|findstr "8080" 查看PID對應的進程tasklist|findstr "2212" 實例 博主碰到的是8080端口被占用了&#xff0c;如下圖…

Android quot;QR二維碼掃描quot;

支持燈 掃描結果 支持 抄、分享、瀏覽打開&#xff08;超鏈接&#xff09; 自己主動保存掃描記錄 劃刪除 和源代碼 git: http://git.oschina.net/892642257/QRCode csdn(0分): http://download.csdn.net/detail/onlyonecoder/7713589 版權聲明&#xff1a;本文博主原創文章。博…

ASP.NET Core中的依賴注入(4): 構造函數的選擇與服務生命周期管理

ServiceProvider最終提供的服務實例都是根據對應的ServiceDescriptor創建的&#xff0c;對于一個具體的ServiceDescriptor對象來說&#xff0c;如果它的ImplementationInstance和ImplementationFactory屬性均為Null&#xff0c;那么ServiceProvider最終會利用其ImplementationT…

C# WPF布局控件LayoutControl介紹

Dev學習地址文檔地址 &#xff1a;https://docs.devexpress.com/wpf&#xff1a;https://docs.devexpress.com/WPF/7875/wpf-controlswinform&#xff1a;https://docs.devexpress.com/WindowsForms/7874/winforms-controlsasp.NET: https://docs.devexpress.com/AspNet/7873/a…

《看聊天記錄都學不會C語言?太菜了吧》(7)下一篇文章告訴你牛郎是誰

若是大一學子或者是真心想學習剛入門的小伙伴可以私聊我&#xff0c;若你是真心學習可以送你書籍&#xff0c;指導你學習&#xff0c;給予你目標方向的學習路線&#xff0c;無套路&#xff0c;博客為證。 本系列文章將會以通俗易懂的對話方式進行教學&#xff0c;對話中將涵蓋…

【遙感物候】30年物候始期空間分布特征(平均值)和變化趨勢分析(Slope 一元線性回歸分析)

問題分析:本文的數據為經過預處理和計算得到的30年(1983-2012年)物候參數始期遙感數據,共計30期影像,現在需要逐像元計算整個物候始期的空間分布特征(平均值)和變化趨勢分析(Slope 一元線性回歸分析)。最終的效果(左圖為分布特征,右圖為變化趨勢): 一、方法原理 …

Android之CheckBox進行代碼設置setChecked(true)會觸發setOnCheckedChangeListener事件

1 問題 我們對CheckBox設置了setOnCheckedChangeListener監聽&#xff0c;代碼里面對CheckBox單獨代碼進行設置勾選(setChecked(true))的時候&#xff0c;會觸發OnCheckedChangeListener事件 2 解決辦法 用buttonView.isPressed()解決&#xff0c;這樣就只有手動點擊CheckBox…

密碼技術

要理解SSL就必須理解密碼系統、消息摘要函數(單向或散列函數)和數字簽名&#xff0c;這些技術是許多文獻所討論的主題(比如[AC96)&#xff0c;提供了保密性、完整性和認證的基礎。 密碼系統 假設Alice想給她的銀行發一個消息以劃轉資金&#xff0c;并希望這個消息是保密的&…

deb php7 fileinfo,linux安裝php7.2擴展fileinfo

最簡便的方法是使用pecl安裝php的擴展&#xff0c;方便快捷&#xff0c;這里使用的是源碼編譯安裝php擴展項目 中上傳圖片遇到的問題&#xff1a;明顯是fileinfo不被支持&#xff0c;沒有安裝fileinfo。接下來開始安裝因為我的linux服務器里比較干凈&#xff0c;所以之前的php源…

Android之提示java.lang.RuntimeException: Parcel: unable to marshal value Image問題

1 問題 使用Intent攜帶數據(putExtra)跳轉activity,提示如下錯誤 04-18 22:42:49.664 16194 16194 E AndroidRuntime: Process: com.appsinnova.android.keepshare, PID: 16194 04-18 22:42:49.664 16194 16194 E AndroidRuntime: java.lang.RuntimeException: Parcel: unabl…

使用keepalived實現雙機熱備

2019獨角獸企業重金招聘Python工程師標準>>> 通常說的雙機熱備是指兩臺機器都在運行&#xff0c;但并不是兩臺機器都同時在提供服務。當提供服務的一臺出現故障的時候&#xff0c;另外一臺會馬上自動接管并且提供服務&#xff0c;而且切換的時間非常短。下面來以kee…

《看聊天記錄都學不會C語言?太菜了吧》(8)牛郎和織女竟有一個孩子?

若是大一學子或者是真心想學習剛入門的小伙伴可以私聊我&#xff0c;若你是真心學習可以送你書籍&#xff0c;指導你學習&#xff0c;給予你目標方向的學習路線&#xff0c;無套路&#xff0c;博客為證。 本系列文章將會以通俗易懂的對話方式進行教學&#xff0c;對話中將涵蓋…

技術貼:觸摸屏(TP)技術交流

轉載自&#xff1a;易觸網科技 電容式TP的動作原理 PS:電容式TP動作原理是利用人體電流感應來進行的&#xff0c;當人的手指觸摸在TP上&#xff0c;與Panle上的ito電路形成一個耦合電容&#xff08;電容效應&#xff09;&#xff0c;於是手指從觸控點上吸走了一個微小的電流&am…

【遙感物候】植被物候與氣候(氣溫和降水)條件的空間相關性分析

植被生長與氣候的關系最為密切,通過計算植被各個生長季參數和氣溫、降水之間的相關系數可以分析生長季參數的變化與氣溫、降水之間的關系的程度。本文計算30年的植被物候參數和氣候數據之間的相關性,最終效果如下: 目錄 一、相關性分析原理

HttpContext.TraceIdentifier那嚴謹的設計

前言Asp.Net Core中有一個不受人重視的屬性HttpContext.TraceIdentifier&#xff0c;它在鏈路追蹤中非常有用&#xff0c;下面是官方的定義:在項目中一般會將該字段輸出到每一條日志中&#xff0c;也可以將此Id作為通用響應字段返回前端&#xff0c;后續可以根據該屬性和日志匹…

iOS - 富文本AttributedString

最近項目中用到了圖文混排&#xff0c;所以就研究了一下iOS中的富文本&#xff0c;打算把研究的結果分享一下&#xff0c;也是對自己學習的一個總結。 在iOS中或者Mac OS X中怎樣才能將一個字符串繪制到屏幕上呢&#xff1f; 簡單來說&#xff0c;是通過控件來完成的&#xff0…