项目以前的帮助文档，隐私政策等都是使用老的页面进行富文本编辑。老的富文本有很多历史遗留问题，遂决定采用新的文档工具重新进行编辑。正好看到WriterSide可以进行文档编写，且支持发布到线上环境。WriterSide目前是EAP版本，不需要账户既可以进行帮助文档编写。
工具下载
可以通过JetBrains家的ToolBox来进行下载。
文档编写
下载完成后，就可以开始愉快的编写。还是用我们熟悉的markdown语法来进行编写。在topics文件夹下面创建需要编写的md文件。
cfg--配置目录如果没有，可以手动创建。后面会介绍有哪些自定义配置项可以配置。
特性功能
常规md语法都是支持的，这个我们就不做赘述了。主要介绍一下额外支持的内容，WriterSide是md语法和xml语法相互配合，辅助我们更方便的编写文档。
Procedure（过程）
插入一个过程，过程中排列相应的步骤，每个步骤中我们可以插入文本，图片，代码等。
<procedure title="Inject a procedure" id="inject-a-procedure">
<step>
<p>Start typing <code>procedure</code> and select a procedure type from the completion suggestions:</p>
<img src="completion_procedure.png" alt="completion suggestions for procedure" border-effect="line"/>
</step>
<step>
<p>Press <shortcut>Tab</shortcut> or <shortcut>Enter</shortcut> to insert the markup.</p>
</step>
</procedure>
Tabs （切换页）
就是我们经常用的Tab，这里我将Procedure和Tab进行结合输出。
<tabs>
<tab title="使用支付功能">
<procedure>
<step>
<p>个人信息收集项：公交卡号、充值金额、时间等相关信息</p>
</step>
<step>
<p>系统权限收集项：无</p>
</step>
<step>
<p>使用目的：第三方支付SDK使用</p>
</step>
<step>
<p>使用场景：用户使用IC卡充值，云充，助学公交充值时</p>
</step>
</procedure>
</tab>
<tab title="使用年审、新办卡、助学公交功能">
<procedure>
<step>
<p>个人信息收集项：用户姓名，身份证，身份证正面照片信息</p>
</step>
<step>
<p>系统权限收集项：根据所选照片上传方式，收集存储和相机权限，具体可看系统设置</p>
</step>
<step>
<p>使用目的：用户云办理中的卡片年审，助学公交功能中，需要用户的实名信息进行线下人工核验，防止出现冒用的情况</p>
</step>
<step>
<p>使用场景：用户同意获取权限后，使用公交卡年审、新办卡、助学公交时</p>
</step>
</procedure>
</tab>
</tabs>
展示效果：
Collapsible（折叠）
可以折叠内容，用户可以点击➕号来扩展出对应的内容
#### Supplementary info {collapsible="true"}
Content under such header will be collapsed by default, but you can modify the behavior by adding the following attribute:
`default-state="expanded"`
Img
可以直接通过img标签来插入图片，可以方便的控制图片的宽度，边框等配置。
变量
项目中可以直接引入配置文件中的变量，进行替换输入。在v.list文件中我们可以增加自己需要的变量。
在文档中，通过%%可以直接引用。
配置
在WriterSide目录下创建cfg目录，添加buildsprofiles.xml文件，可以对项目部署相关的配置进行调整。
- 变量中支持很多配置项，这里配置的主题色，favicon图标，网页logo。
- 底部配置了copyright
发布
打包
WriterSide支持两种输出：
- 输出成可以发布的zip文件，无缝集成到nginx中，进行网页访问。
- 输出成pdf文件。
我需要的nginx下载发布文件
上传到Nginx
server {
listen 443 ssl;
server_name helpdoc.xxxx.com;
ssl_certificate /whpe/nginx/cert/xxxx.com_bundle.crt;
ssl_certificate_key /whpe/nginx/cert/xxxx.com_RSA.key;
ssl_session_cache shared:SSL:1m;
ssl_session_timeout 5m;
ssl_ciphers HIGH:!aNULL:!MD5;
ssl_prefer_server_ciphers on;
location / {
root /whpe/privacy-dist;
index index.html index.htm;
try_files $uri $uri/ @router;
}
location @router{
rewrite ^.*$ /index.html last;
}
}
nginx配置是参考vue前端项目部署，可以完美匹配，不需要做任何操作，发布后即可以正常访问。
问题
编写文档时，我想把某些文字调整的小一些，发现是不行的。还有想隐藏一下页面地步的导航栏也是没有地方可以配置。这种定制化的需求就无法满足，这个时候就需要Writerside支持一下自定义css，让我们可以自行来控制页面的个性化显示。好在官网说下个版本会支持custom css，更方便使用。
最终效果
整体使用上还是非常丝滑。
