|
|
</code></pre> <div class="line-numbers-wrapper"><span class="line-number">1</span><br><span class="line-number">2</span><br></div></div><p>只进行文档写作,不希望本地运行网站服务的情况,仅需执行 <code>3、4、5、11</code> 步骤</p> <h2 id="文档写作"><a href="#文档写作" class="header-anchor">#</a> 文档写作</h2> <p>Markdown 标记语言语法</p> <ul><li><a href="https://www.w3cschool.cn/markdownyfsm/markdownyfsm-odm6256r.html" target="_blank" rel="noopener noreferrer">https://www.w3cschool.cn<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></li> <li><a href="https://www.markdown.cn/" target="_blank" rel="noopener noreferrer">https://www.markdown.cn/<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></li> <li><a href="https://markdown-zh.readthedocs.io/en/latest/" target="_blank" rel="noopener noreferrer">https://markdown-zh.readthedocs.io/en/latest/<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></li> <li><a href="http://wow.kuapp.com/markdown/" target="_blank" rel="noopener noreferrer">http://wow.kuapp.com/markdown/<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></li></ul> <p>推荐编辑器</p> <ul><li><a href="https://typora.io/" target="_blank" rel="noopener noreferrer">Typora<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></li> <li><a href="https://code.visualstudio.com/" target="_blank" rel="noopener noreferrer">VSCode<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></li></ul> <blockquote><p>文档写作平台项目基于 VuePress 构建,具体配置内容请查看 <a href="https://vuepress.vuejs.org/zh/" target="_blank" rel="noopener noreferrer">这里<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></p></blockquote> <h3 id="写作方式"><a href="#写作方式" class="header-anchor">#</a> 写作方式</h3> <p>文档写作平台所有编写的文档均是基于 <strong>Markdown</strong> 标记语言来编写,它的特点是使用简单的符号即可清晰地描述整个文档结构和排版,仅需要普通文本编辑器即可完成,不像 Word、Excel 等格式必须安装 Microsft Office 才可以正常使用;目前 Markdown 标记语言已经被广泛使用于国内、国际各种记事本或笔记平台、知识平台、写作平台,成为一种流行的文档编写格式,且范围不仅仅是软件行业</p> <p>在网站的内容组织上,一个目录或站点的默认访问位置是 <code>index.html</code>,这是整个互联网环境、网页服务平台、网页服务软件等组织共同形成的约定俗成的结果</p> <p>在以 Markdown 标记语言为主要格式和形式的文档平台中,大家约定俗成的默认文档为 <code>README.md</code>(注意大小写),其功能与 <code>index.html</code> 一致,可以将其理解为是一个目录或是一个文档站点的里的 <strong>首页</strong></p> <p><strong>HTML</strong></p> <p>实际上,在文档写作平台中,所有的 Markdown 文档最终会被编译为 HTML 格式的网页作为最终展现,所以在内容的编写上可以放心使用部分 HTML 标签的排版,建议是排版方面的标签,<strong>表单类型的标签请尽可能不要使用</strong>,以免出现不可预期的问题</p> <h3 id="资源内容添加"><a href="#资源内容添加" class="header-anchor">#</a> 资源内容添加</h3> <p>在文档写作过程中,除了文档描述自身,往往需要引用图片、跳转链接和文件下载等需求来丰富文档内容</p> <h4 id="资源内容说明"><a href="#资源内容说明" class="header-anchor">#</a> 资源内容说明</h4> <p>资源可分为以下两类</p> <ul><li>图片</li> <li>文档(Word、Excel、PowerPoint或其它类型文档)</li></ul> <p>其中,图片可在文档中直接显示,而其它类型文件可作为下载附件的方式挂载在文档中</p> <p>所有资源存放位置:</p> <p><code>/.vuepress/public/</code></p> <div class="custom-block danger"><p class="custom-block-title">WARNING</p> <p>注意:所有资源要求必须有序存放,例如根据业务类型、团队类型等形式分目录存放</p></div> <h4 id="资源使用方式"><a href="#资源使用方式" class="header-anchor">#</a> 资源使用方式</h4> <ul><li>图片内容</li></ul> <p>假设有一张图片存放于以下位置</p> <p><code>/.vuepress/public/logo.png</code></p> <p>那么在文档中引用该图片的方式为</p> <p><code>![logo](/logo.png)</code></p> <p>渲染结果</p> <p><img src="/logo.png" alt="logo"></p> <p>可以看到 <code>/</code> 资源引用的根位置指向了 <code>/.vuepress/public/</code></p> <div class="custom-block danger"><p class="custom-block-title">WARNING</p> <p>如果设置的图片是项目 Logo、二维码(App 或 小程序等),必须按照以下格式使用</p> <div class="language-html line-numbers-mode"><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>img</span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>/xxx.jpg<span class="token punctuation">"</span></span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>img<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
|