[{"data":1,"prerenderedAt":537},["ShallowReactive",2],{"wiki-page-\u002Fen-us\u002Fwiki\u002F2025-12-25-markdown-jiao-cheng\u002F0200-huan-jing-da-jian":3,"wiki-doc-items-\u002Fen-us\u002Fwiki\u002F2025-12-25-markdown-jiao-cheng\u002F0200-huan-jing-da-jian":501,"language-switcher-data-\u002Fen-us\u002Fwiki\u002F2025-12-25-markdown-jiao-cheng\u002F0200-huan-jing-da-jian":521,"wiki-i18n-paths-\u002Fen-us\u002Fwiki\u002F2025-12-25-markdown-jiao-cheng\u002F0200-huan-jing-da-jian":536},{"id":4,"title":5,"body":6,"canonicalPath":482,"chapterDepth":483,"chapterOrder":484,"date":338,"description":485,"docI18nKey":486,"docKey":487,"docRoot":488,"docTitle":489,"extension":490,"i18nKey":491,"isBlogPost":492,"isWikiDoc":379,"isWikiIndex":492,"layout":493,"legacyPath":493,"locale":494,"localeSlug":495,"meta":496,"navigation":379,"path":482,"seo":497,"sourcePath":498,"sourceStem":491,"stem":499,"wikiDepth":79,"__hash__":500},"content\u002F_i18n\u002Fen-us\u002Fwiki\u002F2025-12-25-MarkDown教程\u002F0200-环境搭建.md","Environment Setup",{"type":7,"value":8,"toc":478},"minimark",[9,14,27,35,41,48,52,57,60,67,157,161,167,170,176,181,188,198,231,237,288,298,301,312,320,329,344,347,350,353,360,363,458,461,466,469,474],[10,11,13],"h1",{"id":12},"install","Install",[15,16,17,18,22,23,26],"p",{},"First, you can install a VScode plugin called ",[19,20,21],"code",{},"Markdown All in One",", and then there's also ",[19,24,25],{},"Markdown Preview Enhanced",".",[15,28,29],{},[30,31,32],"a",{"href":32,"rel":33},"https:\u002F\u002Fmarketplace.visualstudio.com\u002Fitems?itemName=yzhang.markdown-all-in-one",[34],"nofollow",[15,36,37],{},[30,38,39],{"href":39,"rel":40},"https:\u002F\u002Fmarketplace.visualstudio.com\u002Fitems?itemName=shd101wyy.markdown-preview-enhanced",[34],[15,42,43],{},[44,45],"img",{"alt":46,"src":47},"","https:\u002F\u002Fcdn.tungchiahui.cn\u002Ftungwebsite\u002Fassets\u002Fimages\u002F2025\u002F12\u002F25\u002F1787036895321-6b09b664.webp",[10,49,51],{"id":50},"paste-the-configuration-image-directly","Paste the configuration image directly.",[53,54,56],"h2",{"id":55},"规划文件夹与图片等命名老方法新手推荐","规划文件夹与图片等命名(老方法,新手推荐)",[15,58,59],{},"The image name format is the creation date of the current image: timestamp.extension, for example 20251225153422.webp.",[15,61,62,63,66],{},"Create ",[19,64,65],{},".vscode\u002Fsettings.json"," in the project root directory.",[68,69,73],"pre",{"className":70,"code":71,"language":72,"meta":46,"style":46},"language-json shiki shiki-themes github-light github-dark","{\n  \"markdown.editor.filePaste.enabled\": \"always\",\n  \"markdown.copyFiles.destination\": {\n    \"**\u002Fcontent\u002Fposts\u002F*.md\": \"\u002Fpublic\u002Fimages\u002F${documentBaseName}\u002F${unixTime}.${fileExtName}\",\n    \"**\u002Fcontent\u002Fpages\u002F*.md\": \"\u002Fpublic\u002Fimages\u002Fpages\u002F${unixTime}.${fileExtName}\"\n  },\n  \"markdown.copyFiles.overwriteBehavior\": \"nameIncrementally\"\n}\n","json",[19,74,75,84,101,110,123,134,140,151],{"__ignoreMap":46},[76,77,80],"span",{"class":78,"line":79},"line",1,[76,81,83],{"class":82},"sVt8B","{\n",[76,85,87,91,94,98],{"class":78,"line":86},2,[76,88,90],{"class":89},"sj4cs","  \"markdown.editor.filePaste.enabled\"",[76,92,93],{"class":82},": ",[76,95,97],{"class":96},"sZZnC","\"always\"",[76,99,100],{"class":82},",\n",[76,102,104,107],{"class":78,"line":103},3,[76,105,106],{"class":89},"  \"markdown.copyFiles.destination\"",[76,108,109],{"class":82},": {\n",[76,111,113,116,118,121],{"class":78,"line":112},4,[76,114,115],{"class":89},"    \"**\u002Fcontent\u002Fposts\u002F*.md\"",[76,117,93],{"class":82},[76,119,120],{"class":96},"\"\u002Fpublic\u002Fimages\u002F${documentBaseName}\u002F${unixTime}.${fileExtName}\"",[76,122,100],{"class":82},[76,124,126,129,131],{"class":78,"line":125},5,[76,127,128],{"class":89},"    \"**\u002Fcontent\u002Fpages\u002F*.md\"",[76,130,93],{"class":82},[76,132,133],{"class":96},"\"\u002Fpublic\u002Fimages\u002Fpages\u002F${unixTime}.${fileExtName}\"\n",[76,135,137],{"class":78,"line":136},6,[76,138,139],{"class":82},"  },\n",[76,141,143,146,148],{"class":78,"line":142},7,[76,144,145],{"class":89},"  \"markdown.copyFiles.overwriteBehavior\"",[76,147,93],{"class":82},[76,149,150],{"class":96},"\"nameIncrementally\"\n",[76,152,154],{"class":78,"line":153},8,[76,155,156],{"class":82},"}\n",[53,158,160],{"id":159},"使用-md-image-uploader推荐","使用 MD Image Uploader（推荐）",[15,162,163,166],{},[19,164,165],{},"MD Image Uploader"," 可以在 Markdown 中直接粘贴图片，将图片转换为 WebP 后上传到兼容 S3 的对象存储，并自动插入 CDN 图片链接。",[15,168,169],{},"插件下载地址：",[15,171,172],{},[30,173,174],{"href":174,"rel":175},"https:\u002F\u002Fmarketplace.visualstudio.com\u002Fitems?itemName=tungchiahui.md-image-uploader",[34],[15,177,178],{},[44,179],{"alt":46,"src":180},"https:\u002F\u002Fcdn.tungchiahui.cn\u002Ftungwebsite\u002Fassets\u002Fimages\u002F2025\u002F12\u002F25\u002F1787036910208-ed1a73d9.webp",[15,182,183,184,187],{},"也可以在 VS Code 扩展面板中搜索 ",[19,185,186],{},"tungchiahui.md-image-uploader","，然后点击“安装”。",[15,189,190,191,194,195,197],{},"访问密钥属于敏感信息，请打开 VS Code 的",[19,192,193],{},"首选项：打开用户设置(JSON)","，将下面两项写入个人设置。不要将它们放进项目的 ",[19,196,65],{},"，也不要提交到 Git：",[68,199,201],{"className":70,"code":200,"language":72,"meta":46,"style":46},"\u002F\u002F 请放到个人设置，不要放到项目的 .vscode\u002Fsettings.json\n\"mdImageUploader.s3.accessKeyId\": \"xxxxxxxxxxxxxxxxxxxx\",\n\"mdImageUploader.s3.secretAccessKey\": \"xxxxxxxxxxxxxxxxxxxx\"\n",[19,202,203,209,221],{"__ignoreMap":46},[76,204,205],{"class":78,"line":79},[76,206,208],{"class":207},"sJ8bj","\u002F\u002F 请放到个人设置，不要放到项目的 .vscode\u002Fsettings.json\n",[76,210,211,214,216,219],{"class":78,"line":86},[76,212,213],{"class":96},"\"mdImageUploader.s3.accessKeyId\"",[76,215,93],{"class":82},[76,217,218],{"class":96},"\"xxxxxxxxxxxxxxxxxxxx\"",[76,220,100],{"class":82},[76,222,223,226,228],{"class":78,"line":103},[76,224,225],{"class":96},"\"mdImageUploader.s3.secretAccessKey\"",[76,227,93],{"class":82},[76,229,230],{"class":96},"\"xxxxxxxxxxxxxxxxxxxx\"\n",[15,232,233,234,236],{},"以下配置可以放到项目的 ",[19,235,65],{},"。这是腾讯云 COS 的配置示例，请根据自己的存储桶和 CDN 地址进行修改：",[68,238,242],{"className":239,"code":240,"language":241,"meta":46,"style":46},"language-jsonc shiki shiki-themes github-light github-dark","{\n  \u002F\u002F 可以放到 settings.json 的部分，以下是例子\n  \"mdImageUploader.s3.endpoint\": \"https:\u002F\u002Fcos.ap-beijing.myqcloud.com\",\n  \"mdImageUploader.s3.region\": \"ap-beijing\",\n  \"mdImageUploader.s3.bucket\": \"cdn-tungchiahui-cn-1377333392\",\n  \"mdImageUploader.cdnUrl\": \"https:\u002F\u002Fcdn.tungchiahui.cn\",\n  \"mdImageUploader.datedUploadPath\": \"\u002Ftungwebsite\u002Fassets\u002Fimages\",\n  \"mdImageUploader.undatedUploadPath\": \"\u002Ftungwebsite\u002Fassets\u002Fimages\u002Fundate\"\n}\n","jsonc",[19,243,244,248,253,258,263,268,273,278,283],{"__ignoreMap":46},[76,245,246],{"class":78,"line":79},[76,247,83],{},[76,249,250],{"class":78,"line":86},[76,251,252],{},"  \u002F\u002F 可以放到 settings.json 的部分，以下是例子\n",[76,254,255],{"class":78,"line":103},[76,256,257],{},"  \"mdImageUploader.s3.endpoint\": \"https:\u002F\u002Fcos.ap-beijing.myqcloud.com\",\n",[76,259,260],{"class":78,"line":112},[76,261,262],{},"  \"mdImageUploader.s3.region\": \"ap-beijing\",\n",[76,264,265],{"class":78,"line":125},[76,266,267],{},"  \"mdImageUploader.s3.bucket\": \"cdn-tungchiahui-cn-1377333392\",\n",[76,269,270],{"class":78,"line":136},[76,271,272],{},"  \"mdImageUploader.cdnUrl\": \"https:\u002F\u002Fcdn.tungchiahui.cn\",\n",[76,274,275],{"class":78,"line":142},[76,276,277],{},"  \"mdImageUploader.datedUploadPath\": \"\u002Ftungwebsite\u002Fassets\u002Fimages\",\n",[76,279,280],{"class":78,"line":153},[76,281,282],{},"  \"mdImageUploader.undatedUploadPath\": \"\u002Ftungwebsite\u002Fassets\u002Fimages\u002Fundate\"\n",[76,284,286],{"class":78,"line":285},9,[76,287,156],{},[15,289,290,291,294,295,297],{},"配置完成后，打开一个 Markdown 文件，复制截图或本地图片，然后按 ",[19,292,293],{},"Ctrl+V"," 粘贴。插件会依次转换图片、计算上传路径、上传到对象存储，并将最终的 Markdown 图片链接插入当前位置。可以在 VS Code 的“输出”面板中选择 ",[19,296,165],{}," 查看实时日志。",[15,299,300],{},"上传路径使用以下日期优先级：",[302,303,304],"ol",{},[305,306,307,308,311],"li",{},"优先读取距离当前 Markdown 最近的、包含合法 ",[19,309,310],{},"YYYY-MM-DD"," 日期的父目录；",[302,313,314],{"start":86},[305,315,316,317,319],{},"父目录没有合法日期时，读取 Markdown 文件名中的",[19,318,310],{},"格式日期；",[302,321,322],{"start":103},[305,323,324,325,328],{},"两处都没有日期时，使用粘贴当天的本地日期和 ",[19,326,327],{},"undatedUploadPath","。",[15,330,331,332,335,336,339,340,343],{},"例如当前文件位于 ",[19,333,334],{},"content\u002Fwiki\u002F2025-12-25-MarkDown教程\u002F0200-环境搭建.md","，图片会使用目录日期 ",[19,337,338],{},"2025-12-25","，上传到 ",[19,341,342],{},"datedUploadPath"," 对应的年月日目录。",[10,345,346],{"id":346},"创建第一个md文件",[15,348,349],{},"Open VScode",[15,351,352],{},"创建一个.md为扩展名的文件",[15,354,355,356,359],{},"将文件保存为 ",[19,357,358],{},"TEST.md","（注意扩展名是 .md）",[15,361,362],{},"里面内容改为:",[68,364,368],{"className":365,"code":366,"language":367,"meta":46,"style":46},"language-markdown shiki shiki-themes github-light github-dark","# 我的第一个 Markdown 文档\n\n这是我学习 Markdown 的开始。\n\n## 学习目标\n\n- 掌握基本语法\n- 了解应用场景\n- 能够独立创作文档\n\n## 今天的感受\n\n学习 Markdown 比我想象的**简单**，我对接下来的学习充满*期待*！\n\n---\n\n> 学习是一个持续的过程，每一小步都是进步。\n","markdown",[19,369,370,375,381,386,390,395,399,404,409,414,419,425,430,436,441,447,452],{"__ignoreMap":46},[76,371,372],{"class":78,"line":79},[76,373,374],{},"# 我的第一个 Markdown 文档\n",[76,376,377],{"class":78,"line":86},[76,378,380],{"emptyLinePlaceholder":379},true,"\n",[76,382,383],{"class":78,"line":103},[76,384,385],{},"这是我学习 Markdown 的开始。\n",[76,387,388],{"class":78,"line":112},[76,389,380],{"emptyLinePlaceholder":379},[76,391,392],{"class":78,"line":125},[76,393,394],{},"## 学习目标\n",[76,396,397],{"class":78,"line":136},[76,398,380],{"emptyLinePlaceholder":379},[76,400,401],{"class":78,"line":142},[76,402,403],{},"- 掌握基本语法\n",[76,405,406],{"class":78,"line":153},[76,407,408],{},"- 了解应用场景\n",[76,410,411],{"class":78,"line":285},[76,412,413],{},"- 能够独立创作文档\n",[76,415,417],{"class":78,"line":416},10,[76,418,380],{"emptyLinePlaceholder":379},[76,420,422],{"class":78,"line":421},11,[76,423,424],{},"## 今天的感受\n",[76,426,428],{"class":78,"line":427},12,[76,429,380],{"emptyLinePlaceholder":379},[76,431,433],{"class":78,"line":432},13,[76,434,435],{},"学习 Markdown 比我想象的**简单**，我对接下来的学习充满*期待*！\n",[76,437,439],{"class":78,"line":438},14,[76,440,380],{"emptyLinePlaceholder":379},[76,442,444],{"class":78,"line":443},15,[76,445,446],{},"---\n",[76,448,450],{"class":78,"line":449},16,[76,451,380],{"emptyLinePlaceholder":379},[76,453,455],{"class":78,"line":454},17,[76,456,457],{},"> 学习是一个持续的过程，每一小步都是进步。\n",[15,459,460],{},"点击下方这个图标可以预览.",[15,462,463],{},[44,464],{"alt":46,"src":465},"https:\u002F\u002Fcdn.tungchiahui.cn\u002Ftungwebsite\u002Fassets\u002Fimages\u002F2025\u002F12\u002F25\u002F1787037063137-1d47eb79.webp",[15,467,468],{},"预览如下图:",[15,470,471],{},[44,472],{"alt":46,"src":473},"https:\u002F\u002Fcdn.tungchiahui.cn\u002Ftungwebsite\u002Fassets\u002Fimages\u002F2025\u002F12\u002F25\u002F1787036989834-c52de7a3.webp",[475,476,477],"style",{},"html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .sj4cs, html code.shiki .sj4cs{--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sZZnC, html code.shiki .sZZnC{--shiki-default:#032F62;--shiki-dark:#9ECBFF}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sJ8bj, html code.shiki .sJ8bj{--shiki-default:#6A737D;--shiki-dark:#6A737D}",{"title":46,"searchDepth":86,"depth":86,"links":479},[480,481],{"id":55,"depth":86,"text":56},{"id":159,"depth":86,"text":160},"\u002Fen-us\u002Fwiki\u002F2025-12-25-markdown-jiao-cheng\u002F0200-huan-jing-da-jian",0,"0200","First, you can install a VScode plugin called Markdown All in One, and then there's also Markdown Preview Enhanced.","wiki\u002F2025-12-25-markdown-jiao-cheng","en-us:2025-12-25-markdown-jiao-cheng","\u002Fen-us\u002Fwiki\u002F2025-12-25-markdown-jiao-cheng","MarkDown教程","md","wiki\u002F2025-12-25-MarkDown教程\u002F0200-环境搭建",false,null,"en-US","en-us",{},{"title":5,"description":485},"\u002Fwiki\u002F2025-12-25-markdown-jiao-cheng\u002F0200-huan-jing-da-jian","_i18n\u002Fen-us\u002Fwiki\u002F2025-12-25-MarkDown教程\u002F0200-环境搭建","6IjJpkwFs9DGj45VvjiRxlMteLTl-uR1D7ixPs8UZxk",[502,507,508,513,518],{"path":503,"stem":504,"title":505,"date":338,"chapterOrder":506,"chapterDepth":483,"docKey":487,"docRoot":488,"docTitle":489,"isWikiDoc":379,"isWikiIndex":492},"\u002Fen-us\u002Fwiki\u002F2025-12-25-markdown-jiao-cheng\u002F0100-jian-jie","_i18n\u002Fen-us\u002Fwiki\u002F2025-12-25-MarkDown教程\u002F0100-简介","Introduction","0100",{"path":482,"stem":499,"title":5,"date":338,"chapterOrder":484,"chapterDepth":483,"docKey":487,"docRoot":488,"docTitle":489,"isWikiDoc":379,"isWikiIndex":492},{"path":509,"stem":510,"title":511,"date":338,"chapterOrder":512,"chapterDepth":483,"docKey":487,"docRoot":488,"docTitle":489,"isWikiDoc":379,"isWikiIndex":492},"\u002Fen-us\u002Fwiki\u002F2025-12-25-markdown-jiao-cheng\u002F0300-jiao-xue","_i18n\u002Fen-us\u002Fwiki\u002F2025-12-25-MarkDown教程\u002F0300-教学","teaching","0300",{"path":514,"stem":515,"title":516,"date":338,"chapterOrder":517,"chapterDepth":483,"docKey":487,"docRoot":488,"docTitle":489,"isWikiDoc":379,"isWikiIndex":492},"\u002Fen-us\u002Fwiki\u002F2025-12-25-markdown-jiao-cheng\u002F0400-gao-ji-ji-qiao","_i18n\u002Fen-us\u002Fwiki\u002F2025-12-25-MarkDown教程\u002F0400-高级技巧","高级技巧","0400",{"path":488,"stem":519,"title":520,"date":338,"chapterOrder":493,"chapterDepth":483,"docKey":487,"docRoot":488,"docTitle":489,"isWikiDoc":379,"isWikiIndex":379},"_i18n\u002Fen-us\u002Fwiki\u002F2025-12-25-MarkDown教程\u002Findex","Markdown tutorial",{"variants":522},[523,524,527,530,533],{"path":482,"localeSlug":495,"i18nKey":491},{"path":525,"localeSlug":526,"i18nKey":491},"\u002Fzh-hant\u002Fwiki\u002F2025-12-25-markdown-jiao-cheng\u002F0200-huan-jing-da-jian","zh-hant",{"path":528,"localeSlug":529,"i18nKey":491},"\u002Fzh-hk\u002Fwiki\u002F2025-12-25-markdown-jiao-cheng\u002F0200-huan-jing-da-jian","zh-hk",{"path":531,"localeSlug":532,"i18nKey":491},"\u002Fzh-tw\u002Fwiki\u002F2025-12-25-markdown-jiao-cheng\u002F0200-huan-jing-da-jian","zh-tw",{"path":534,"localeSlug":535,"i18nKey":491},"\u002Fzh-cn\u002Fwiki\u002F2025-12-25-markdown-jiao-cheng\u002F0200-huan-jing-da-jian","zh-cn",[482,498,525,498,528,498,531,498,534,498],1788531255582]