Mari kita bincangkan tentang cara membina persekitaran penulisan MarkDown dalam VSCode

Caj Typora? Artikel berikut akan memperkenalkan kepada anda cara membina persekitaran penulisan MarkDown dalam VSCode Ia adalah perisian sumber terbuka dan boleh dipercayai sepenuhnya! Sangat disyorkan!

Alat penulisan MarkDown yang paling saya biasa gunakan ialah Typora Pengalaman pengguna WYSIWYG, ditambah dengan tema yang kaya, membuatkan orang ramai tidak dapat menahan diri untuk menjerit "Baunya sungguh. baik."

Tetapi semua orang tahu bahawa selepas Typora 1.0, ia mula dicas Baru-baru ini, Typora yang dipasang pada komputer Mac saya telah mula menggesa saya untuk menaik taraf. Lebih-lebih lagi, semasa saya menyusun "Manual Serangan Balas Non-Scum", Typora sangat tersekat kerana fail itu terlalu besar, jadi, selepas berfikir panjang, saya memutuskan untuk menggunakan Kod VS untuk membina persekitaran penulisan MarkDwon.

1. Pemasangan Kod VS

Tidak perlu diperkatakan lagi tentang pemasangan Kod VS Muat turun versi pakej pemasangan yang sepadan laman web rasmi dan pasangkannya. [Pembelajaran yang disyorkan: "tutorial pengenalan vscode"]

Alamat muat turun tapak web rasmi: code.visualstudio.com/Download

Ini ialah Kod VS yang dipasang pada komputer Windows saya Ambil perhatian bahawa bar atas dan bar sisi saya kedua-duanya dalam bahasa Cina kerana pemalam Cina dipasang:

<.>2. Peningkatan pemalam MarkDown

Mari kita lihat kesan membuka fail MarkDown secara terus dengan Kod VS:

Pratonton dua lajur boleh dibuka di penjuru kanan sebelah atas:

Nampak okey, tetapi masih ada ruang untuk penambahbaikan dan kami boleh memasang beberapa pemalam untuk dibuat ia lebih baik.

1 Markdown All in One

Markdown All in One ialah pemalam peningkatan MardDown semua-dalam-satu:

Ia mendakwa menyokong semua fungsi yang diperlukan oleh Markdown, termasuk pintasan papan kekunci, direktori, pratonton automatik, dll. Anda boleh melihat halaman sambungannya atau dokumentasi gudang:

https: //marketplace.visualstudio.com/items?itemName=yzhang.markdown-all-in-one
• 
  
https://github.com/yzhang-gh/vscode-markdown/blob /master/ README.md
• 
  

2.Markdown Image

Markdown Image adalah terutamanya untuk memasukkan gambar dalam MarkDown Extension untuk menyokong meletakkan imej pada katil imej tempatan atau pihak ketiga atau storan objek.

Menggunakan pemalam ini, anda boleh terus menyalin imej tempatan yang serupa dengan Typora, dan kemudian menampalnya ke dalam MarkDown Fail imej diletakkan secara setempat secara lalai, dan juga boleh dikonfigurasikan untuk menyokong

, Imgur, 七牛, SM.MS Menunggu gambar. Coding

Selepas memasang pemalam ini, anda boleh melakukan beberapa konfigurasi, masukkan halaman konfigurasi, cari:

, anda boleh mengkonfigurasi laluan relatif, fail imej lalai disimpan dalam markdown-image di bawah laluan. /res

Gunakan kekunci pintasan

untuk menampal terus imej yang disalin daripada papan keratan ke dalam dokumen: Shift Alt V

3.Pratonton Turun Dipertingkat

Pratonton Turun Dipertingkat ialah peningkatan kepada fungsi pratonton Kod VS, yang boleh meningkatkan pengalaman pratonton Kod VS.

Selepas memasang pemalam ini, klik butang pratonton untuk menggunakan pratonton yang dipertingkatkan:

Anda juga boleh gunakannya dalam bar sisi Direktori dipaparkan, tetapi selepas direktori dipaparkan, keseluruhan antara muka kelihatan agak sempit.

Ia juga menyediakan berbilang tema pratonton:

4.Word Count CJK

Word Count CJK ialah pemalam yang digunakan untuk mengira bilangan perkataan Cina:

Bagi seseorang seperti saya yang suka artikel panjang, melihat bilangan perkataan dalam artikel itu juga memberi saya rasa pencapaian.

5. MarkDown Editor

Bagaimana jika kita hanya mahukan pengalaman WYSIWYG dalam Typora?

Saya juga menemui pemalam MarkDown Editor:

Selepas pemasangan selesai, pilih Open with MarkDown Editor untuk fail MD membukanya WYSIWYG MD fail.

Terdapat beberapa pemalam lain:

• markdownlint: semak format markdow
• Pratonton Markdown Penggayaan Github: tema GitHub pratonton

Semua orang juga boleh mengalaminya.

3. Pembinaan katil bergambar

Apabila menulis dalam MarkDown, ada satu lagi keperluan penting, iaitu artikel yang kita tulis mesti diterbitkan, dalam MD Gambar disimpan dalam bentuk laluan, dan laluan tempatan tidak boleh diakses apabila diterbitkan, jadi kami perlu menyambungkan editor MD ke fungsi katil gambar.

Saya pernah membina katil susun atur menggunakan Typora PicGo Gitee, tetapi kemudian Gitee berlaku dan menukarnya kepada Typora PicGo Github Kami mengikuti idea ini dan membina katil susun atur pada VS Code.

1.Konfigurasi repositori GitHub

2.1. Cipta repositori baharu

Buat repositori GitHub baharu:

• Awam, perlu, untuk mengelakkan ketidakbolehcapaian
• Tambahkan fail READM untuk mengelakkan gudang daripada mempunyai cawangan batang

2.2. Jana token

• Masukkan tetapan

• Cari tetapan pembangun

• Buat token akses Peribadi baharu, tetapkan masa untuk tidak tamat tempoh dan berikan kebenaran repo Itu ia

• Token yang dijana mesti direkodkan dan hanya akan dipaparkan sekali

2. Pasang dan konfigurasikan PicGo

2.1 Pasang pemalam PicGO

Cari untuk PicGo dalam Kod VS , pemasangan:

2.2 Konfigurasikan PicGO

• Buka konfigurasi lanjutan PicGo
<.>

Konfigurasikan pemuat naik, pilih github

• Konfigurasi berkaitan GitHub, dengan konfigurasi saya Contohnya:
  • Cawangan: utama, cawangan

  • Laluan: kosong, anda juga boleh mengkonfigurasi laluan relatif

  • Url Tersuai: kosong,
    Malah, anda boleh mengkonfigurasi URL dipercepatkan CDN, jsDeliver, yang merupakan CDN percuma dan nampaknya tidak tersedia baru-baru ini. Anda juga boleh mencubanya. Cara menggunakannya:

    ——https://cdn.jsdelivr.net/gh/你的github用户名/你的仓库名@发布的版本号cdn.jsdelivr.net/gh/fighter3…

  • Repo: fighter3/picgo-win, nama pengguna/format repositori

  • Token: Cuma isikan yang anda simpan sebelum ini

3. Gunakan

• untuk membuka fail MD dan tampal gambar dari tempat lain Gunakan Ctrl Alt U untuk melihat bahawa fail itu berjaya dimuat naik dan boleh dipratonton .

Kekunci pintasan yang berkaitan dengan muat naik imej:

OS

Muat naik gambar dari papan tampal

Muat naik gambar dari penyemak imbas

Muat naik gambar dari kotak input

Windows/Unix

OS	从粘贴版上传图片	从浏览器上传图片	从输入框上传图片
Windows/Unix	Ctrl Alt U	Ctrl Alt E	Ctrl Alt O
OsX	Cmd Opt U	Cmd Opt E	Cmd Opt O

Ctrl Alt E

Ctrl Alt O kod>

OsX

Cmd Opt U

Cmd Opt E

Cmd Opt O

Menggunakan GitHub sebagai katil gambar masih tidak sesuai secara keseluruhan, memuat naik dan mengakses Mereka tidak begitu stabil Kami juga boleh menukar katil imej kepada Qiniu, Tencent Cloud atau Alibaba Cloud dalam pemalam PicGo Proses ini secara umumnya serupa dan agak mudah.

Untuk pengetahuan lanjut tentang VSCode, sila lawati: tutorial vscode!

Atas ialah kandungan terperinci Mari kita bincangkan tentang cara membina persekitaran penulisan MarkDown dalam VSCode. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!