7.3a4688f0.js 11.7 KB
(window.webpackJsonp=window.webpackJsonp||[]).push([[7],{218:function(t,e,r){"use strict";r.r(e);var a=r(0),s=Object(a.a)({},function(){var t=this,e=t.$createElement,r=t._self._c||e;return r("ContentSlotsDistributor",{attrs:{"slot-key":t.$parent.slotKey}},[r("h1",{attrs:{id:"文档写作平台使用入门"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#文档写作平台使用入门","aria-hidden":"true"}},[t._v("#")]),t._v(" 文档写作平台使用入门")]),t._v(" "),r("p",[t._v("介绍文档写作平台的运行方式,如何编写文档及各方面资源的内容组织")]),t._v(" "),r("h2",{attrs:{id:"文档写作平台项目地址"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#文档写作平台项目地址","aria-hidden":"true"}},[t._v("#")]),t._v(" 文档写作平台项目地址")]),t._v(" "),r("p",[r("a",{attrs:{href:"http://192.168.100.254:3000/frontend/doc-press",target:"_blank",rel:"noopener noreferrer"}},[t._v("doc-press"),r("OutboundLink")],1)]),t._v(" "),r("h2",{attrs:{id:"项目运行方式"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#项目运行方式","aria-hidden":"true"}},[t._v("#")]),t._v(" 项目运行方式")]),t._v(" "),r("ol",[r("li",[t._v("安装 "),r("code",[t._v("nodejs")]),t._v(",在 "),r("a",{attrs:{href:"http://nodejs.cn/download/",target:"_blank",rel:"noopener noreferrer"}},[t._v("nodejs 官网"),r("OutboundLink")],1),t._v(" 下载并安装"),r("br"),t._v(" "),r("em",[t._v("windows 下建议下载 "),r("code",[t._v("Windows 安装包 (.msi) 64 位")])])]),t._v(" "),r("li",[t._v("安装 "),r("code",[t._v("yarn")]),t._v(",在 "),r("a",{attrs:{href:"https://www.yarnpkg.com/zh-Hant/docs/install#windows-stable",target:"_blank",rel:"noopener noreferrer"}},[t._v("yarn 官网"),r("OutboundLink")],1),t._v(" 下载并安装")]),t._v(" "),r("li",[t._v("安装 "),r("code",[t._v("git")]),t._v(",在 "),r("a",{attrs:{href:"https://git-scm.com/",target:"_blank",rel:"noopener noreferrer"}},[t._v("git 官网"),r("OutboundLink")],1),t._v(" 下载并安装好")]),t._v(" "),r("li",[t._v("下载并安装 git 图形化工具,推荐使用的有 "),r("a",{attrs:{href:"https://tortoisegit.org/",target:"_blank",rel:"noopener noreferrer"}},[t._v("TortoiseGit"),r("OutboundLink")],1),t._v("、"),r("a",{attrs:{href:"https://www.sourcetreeapp.com/",target:"_blank",rel:"noopener noreferrer"}},[t._v("SourceTree"),r("OutboundLink")],1),t._v("、"),r("a",{attrs:{href:"https://git-fork.com/windows",target:"_blank",rel:"noopener noreferrer"}},[t._v("Fork"),r("OutboundLink")],1)]),t._v(" "),r("li",[t._v("克隆文档写作平台到本地环境")]),t._v(" "),r("li",[t._v("使用命令行进入到文档写作平台目录")]),t._v(" "),r("li",[t._v("运行命令 "),r("code",[t._v("yarn install")]),t._v(" 安装依赖库")]),t._v(" "),r("li",[t._v("运行命令 "),r("code",[t._v("yarn dev")]),t._v(" 运行本地开发平台")]),t._v(" "),r("li",[t._v("运行完成后,命令行界面中会提示访问地址,在浏览器中访问该地址即可开始进行写作,效果如下")]),t._v(" "),r("li",[t._v("此时可开始写作,并在网页中实时预览效果")]),t._v(" "),r("li",[t._v("写作完成后,将内容提交并推送到项目托管地址")])]),t._v(" "),r("div",{staticClass:"language-bash line-numbers-mode"},[r("pre",{pre:!0,attrs:{class:"language-bash"}},[r("code",[t._v("success "),r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("[")]),r("span",{pre:!0,attrs:{class:"token number"}},[t._v("16")]),t._v(":22:08"),r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("]")]),t._v(" Build 42920d finished "),r("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("in")]),t._v(" "),r("span",{pre:!0,attrs:{class:"token number"}},[t._v("3668")]),t._v(" ms"),r("span",{pre:!0,attrs:{class:"token operator"}},[t._v("!")]),t._v("\n"),r("span",{pre:!0,attrs:{class:"token operator"}},[t._v(">")]),t._v(" VuePress dev server listening at http://localhost:8080/\n")])]),t._v(" "),r("div",{staticClass:"line-numbers-wrapper"},[r("span",{staticClass:"line-number"},[t._v("1")]),r("br"),r("span",{staticClass:"line-number"},[t._v("2")]),r("br")])]),r("p",[t._v("只进行文档写作,不希望本地运行网站服务的情况,仅需执行 "),r("code",[t._v("3、4、5、11")]),t._v(" 步骤")]),t._v(" "),r("h2",{attrs:{id:"文档写作"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#文档写作","aria-hidden":"true"}},[t._v("#")]),t._v(" 文档写作")]),t._v(" "),r("p",[t._v("Markdown 标记语言语法")]),t._v(" "),r("ul",[r("li",[r("a",{attrs:{href:"https://www.w3cschool.cn/markdownyfsm/markdownyfsm-odm6256r.html",target:"_blank",rel:"noopener noreferrer"}},[t._v("https://www.w3cschool.cn"),r("OutboundLink")],1)]),t._v(" "),r("li",[r("a",{attrs:{href:"https://www.markdown.cn/",target:"_blank",rel:"noopener noreferrer"}},[t._v("https://www.markdown.cn/"),r("OutboundLink")],1)]),t._v(" "),r("li",[r("a",{attrs:{href:"https://markdown-zh.readthedocs.io/en/latest/",target:"_blank",rel:"noopener noreferrer"}},[t._v("https://markdown-zh.readthedocs.io/en/latest/"),r("OutboundLink")],1)]),t._v(" "),r("li",[r("a",{attrs:{href:"http://wow.kuapp.com/markdown/",target:"_blank",rel:"noopener noreferrer"}},[t._v("http://wow.kuapp.com/markdown/"),r("OutboundLink")],1)])]),t._v(" "),r("p",[t._v("推荐编辑器")]),t._v(" "),r("ul",[r("li",[r("a",{attrs:{href:"https://typora.io/",target:"_blank",rel:"noopener noreferrer"}},[t._v("Typora"),r("OutboundLink")],1)]),t._v(" "),r("li",[r("a",{attrs:{href:"https://code.visualstudio.com/",target:"_blank",rel:"noopener noreferrer"}},[t._v("VSCode"),r("OutboundLink")],1)])]),t._v(" "),r("blockquote",[r("p",[t._v("文档写作平台项目基于 VuePress 构建,具体配置内容请查看 "),r("a",{attrs:{href:"https://vuepress.vuejs.org/zh/",target:"_blank",rel:"noopener noreferrer"}},[t._v("这里"),r("OutboundLink")],1)])]),t._v(" "),r("h3",{attrs:{id:"写作方式"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#写作方式","aria-hidden":"true"}},[t._v("#")]),t._v(" 写作方式")]),t._v(" "),r("p",[t._v("文档写作平台所有编写的文档均是基于 "),r("strong",[t._v("Markdown")]),t._v(" 标记语言来编写,它的特点是使用简单的符号即可清晰地描述整个文档结构和排版,仅需要普通文本编辑器即可完成,不像 Word、Excel 等格式必须安装 Microsft Office 才可以正常使用;目前 Markdown 标记语言已经被广泛使用于国内、国际各种记事本或笔记平台、知识平台、写作平台,成为一种流行的文档编写格式,且范围不仅仅是软件行业")]),t._v(" "),r("p",[t._v("在网站的内容组织上,一个目录或站点的默认访问位置是 "),r("code",[t._v("index.html")]),t._v(",这是整个互联网环境、网页服务平台、网页服务软件等组织共同形成的约定俗成的结果")]),t._v(" "),r("p",[t._v("在以 Markdown 标记语言为主要格式和形式的文档平台中,大家约定俗成的默认文档为 "),r("code",[t._v("README.md")]),t._v("(注意大小写),其功能与 "),r("code",[t._v("index.html")]),t._v(" 一致,可以将其理解为是一个目录或是一个文档站点的里的 "),r("strong",[t._v("首页")])]),t._v(" "),r("p",[r("strong",[t._v("HTML")])]),t._v(" "),r("p",[t._v("实际上,在文档写作平台中,所有的 Markdown 文档最终会被编译为 HTML 格式的网页作为最终展现,所以在内容的编写上可以放心使用部分 HTML 标签的排版,建议是排版方面的标签,"),r("strong",[t._v("表单类型的标签请尽可能不要使用")]),t._v(",以免出现不可预期的问题")]),t._v(" "),r("h3",{attrs:{id:"资源内容添加"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#资源内容添加","aria-hidden":"true"}},[t._v("#")]),t._v(" 资源内容添加")]),t._v(" "),r("p",[t._v("在文档写作过程中,除了文档描述自身,往往需要引用图片、跳转链接和文件下载等需求来丰富文档内容")]),t._v(" "),r("h4",{attrs:{id:"资源内容说明"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#资源内容说明","aria-hidden":"true"}},[t._v("#")]),t._v(" 资源内容说明")]),t._v(" "),r("p",[t._v("资源可分为以下两类")]),t._v(" "),r("ul",[r("li",[t._v("图片")]),t._v(" "),r("li",[t._v("文档(Word、Excel、PowerPoint或其它类型文档)")])]),t._v(" "),r("p",[t._v("其中,图片可在文档中直接显示,而其它类型文件可作为下载附件的方式挂载在文档中")]),t._v(" "),r("p",[t._v("所有资源存放位置:")]),t._v(" "),r("p",[r("code",[t._v("/.vuepress/public/")])]),t._v(" "),r("div",{staticClass:"custom-block danger"},[r("p",{staticClass:"custom-block-title"},[t._v("WARNING")]),t._v(" "),r("p",[t._v("注意:所有资源要求必须有序存放,例如根据业务类型、团队类型等形式分目录存放")])]),t._v(" "),r("h4",{attrs:{id:"资源使用方式"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#资源使用方式","aria-hidden":"true"}},[t._v("#")]),t._v(" 资源使用方式")]),t._v(" "),r("ul",[r("li",[t._v("图片内容")])]),t._v(" "),r("p",[t._v("假设有一张图片存放于以下位置")]),t._v(" "),r("p",[r("code",[t._v("/.vuepress/public/logo.png")])]),t._v(" "),r("p",[t._v("那么在文档中引用该图片的方式为")]),t._v(" "),r("p",[r("code",[t._v("![logo](/logo.png)")])]),t._v(" "),r("p",[t._v("渲染结果")]),t._v(" "),r("p",[r("img",{attrs:{src:"/logo.png",alt:"logo"}})]),t._v(" "),r("p",[t._v("可以看到 "),r("code",[t._v("/")]),t._v(" 资源引用的根位置指向了 "),r("code",[t._v("/.vuepress/public/")])]),t._v(" "),r("div",{staticClass:"custom-block danger"},[r("p",{staticClass:"custom-block-title"},[t._v("WARNING")]),t._v(" "),r("p",[t._v("如果设置的图片是项目 Logo、二维码(App 或 小程序等),必须按照以下格式使用")]),t._v(" "),r("div",{staticClass:"language-html line-numbers-mode"},[r("pre",{pre:!0,attrs:{class:"language-html"}},[r("code",[r("span",{pre:!0,attrs:{class:"token tag"}},[r("span",{pre:!0,attrs:{class:"token tag"}},[r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("<")]),t._v("img")]),t._v(" "),r("span",{pre:!0,attrs:{class:"token attr-name"}},[t._v("src")]),r("span",{pre:!0,attrs:{class:"token attr-value"}},[r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("=")]),r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v('"')]),t._v("/xxx.jpg"),r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v('"')])]),t._v(" "),r("span",{pre:!0,attrs:{class:"token attr-name"}},[t._v("class")]),r("span",{pre:!0,attrs:{class:"token attr-value"}},[r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("=")]),r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v('"')]),t._v("img"),r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v('"')])]),r("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(">")])]),t._v("\n")])]),t._v(" "),r("div",{staticClass:"line-numbers-wrapper"},[r("span",{staticClass:"line-number"},[t._v("1")]),r("br")])]),r("p",[t._v("图片将以 "),r("code",[t._v("150 X 150")]),t._v(" 的统一规格(像素)显示")])]),t._v(" "),r("ul",[r("li",[t._v("文档或其它")])]),t._v(" "),r("p",[t._v("引用其它资源,区别仅为引用方式上,假设有一个文档存放于以下位置")]),t._v(" "),r("p",[r("code",[t._v("/.vuepress/public/design/file.docx")])]),t._v(" "),r("p",[t._v("该文档的引用方式为")]),t._v(" "),r("p",[r("code",[t._v("[file](/design/file.docx)")])]),t._v(" "),r("p",[t._v("根据观察可以发现,文件的引用方式与图片的引用方式上的区别仅是一个 "),r("code",[t._v("!")]),t._v(",而在描述一个链接时增加感叹号则是专用于图片显示")]),t._v(" "),r("blockquote",[r("p",[t._v("附件类型的在点击后,会直接弹出浏览器下载窗口下载该文件,所以该方式适用于与文档内容相关的附件设置")])])])},[],!1,null,null,null);e.default=s.exports}}]);