帮助:灰机Wiki数据更新器\使用VS Code维护代码

Gerley 于6个月前修改了此页面。
帮助
版权信息(CC BY-SA)编辑摘要版权信息(CC BY-NC)FAQHuiji缓存建站评估快速指南吐槽与讨论维基化页面图片邀请新用户站点等级站点评分保护页面表格编辑冲突编辑页面创建新页面恶意编辑Bot重定向页面短域名选择封禁公告模板灰机workshop快速插入项历史与回退链接命名常规视频教程上传媒体文件/1添加引用Wiki标记语言消歧义图片教程修改站点页脚修改站点导航学习地图页面分类移动页面用户权限站长指南章节变量AWB机器人BOOTSTRAPCSS样式库ExcelHTML灰机Wiki数据更新器简繁处理建站心得解析器扩展标签解析器函数命名空间魔术字模板模板参数使用CSS变量Tab切换SMongo素材库灰机停机坪文本处理工具图像处理工具XnView用户组限定的CSS/JS预设模板站点CSS编辑站点JS编辑主题编辑器折叠自动翻译字体搜索器与检索工具使用cockpit组件数学公式在灰机使用Less灰机Json编辑器可配置的站点功能API复杂模板狗头人APP灰机Wiki数据更新器\使用VS Code维护代码机器人开发者101零件MongoDB支持模块PythonMustache模板Semantic FormsSemantic Result Formats/echartsSemantic MediaWiki使用SPA提升访问速度推土机架构用Git管理MediaWiki在灰机使用Vue.js
简单
入门
进阶
复杂
开发
灰机帮助中心

在之前，我们介绍过使用sublimes来编辑wiki，参考：帮助:使用Sublime Text编辑Wiki。类似的，我们也可以使用世界上最好用的本地IDE工具Visual Studio Code（简称VS Code）来编写wiki，特别是lua模块代码。

配合Chrome进行前端调试

辅助工具

尽管我们可以通过VS Code的extension来操作MediaWiki的api来和灰机wiki通信（见“内置接口”章节），但我们还是推荐下载灰机updater来进行内容同步。

这么干的好处

  1. 感觉自己是一个真正的编程小能手
  2. VS Code的代码着色和本地辅助更为丰富，极大提高写代码的效率
  3. 充分利用本地性能，减少浏览器（特别是Chrome）对电脑性能的压力
  4. 还可以方便的维护Gadget命名空间下的css、js甚至是主空间的文章页面
  5. 方便传图、传文件，刷新页面 一锅端，填坑速度+500%


步骤

图1
图2
  1. 在本地创建一个文件夹，用来存放代码
  2. 创建一个空文本文件，并命名为“module_2_test.wiki”，保存。（注意：由于windows不允许文件名中出现“:”\"等字符，因此我们需要使用下面的字符串进行转义）
  3. 配置好灰机updater，在“任务设置-基本”中选择“以文本更新”模式（右图1）
  4. 在“文本”标签中选择之前的文件目录，勾上“转换文件名”（右图2）
  5. 打开VS Code，导入之前的文件夹，配置好lua语法高亮与.wiki的匹配关系后即可使用本地IDE来维护wiki上的代码。
  6. 在修改完代码后，点击灰机updater的“运行”按钮，即可完成代码的上传。
符号 \ / : * "
转义 _0_ _1_ _2_ _3_ _4_

Fetch内容

  • 目前灰机updater仅支持使用文件列表来fetch内容。

使用扩展插件编辑

与Sublimes类似，VS Code的extension库中也有用户上传的相关工具，能够实现VS Code与MediaWiki的直接通信。但我们更推荐你使用灰机自己的updater

  1. 前往Wikitext插件安装页面点击Install，或者打开VS Code，在菜单栏【View】-【Extension】中搜索rowewilsonfrederiskholme.wikitext，然后安装它。
  2. 在VS Code中按Ctrl+逗号，在顶部搜索框输入@ext:rowewilsonfrederiskholme.wikitext，按照以下配置来输入：
Api Path: /api.php
Article Path: /wiki/
Auto Login: 建议选择Always
Enable JavaScript: 打勾
Get CSS: 打勾
Host: 你的灰机站点主机名，例如彩虹六号围攻Wiki是r6s.huijiwiki.com
Password: 你的密码
Redirects: 根据需求选择是否要自动重定向，打勾后，在获取有重定向的页面时会直接得到重定向后的页面结果。
Transfer Protocol: 选择https://
User Name: 你的用户名

完成后关闭本设置页面。配置完成！

基本命令

  • 按F1后会打开一个输入框，输入命令：
    • Login with your account：登陆到站点，在设置项「Auto Login」中选择 Always ，则会在上传页面时自动登录。
    • Logout, if you are already logged in：登出。
    • Pull page to edit：获取一个页面，选择后要输入页面名称，然后按回车就会开始获取。
    • Post your edit to the website：上传编辑，选择后要输入页面名称，然后要输入编辑摘要，随后上传编辑。
  • 按Ctrl+Shift+V可以预览编辑。虽然效果并不像网站上一样，但是也能看出是否有语法错误。

快速编辑

Wikitext插件可以使用@来激活一些快速的 Wikitext 格式，例如@table可以快速生成一个表格。

当然你也可以使用 VS Code 自带的代码片段功能，自定义常用的大型模板片段来快速输入。

关于代码片段功能详情请参考：Snippets in Visual Studio Code

快速切换到 VS Code 编辑

利用 URL Scheme，可以快速的从浏览器把当前页面调到 VS Code 中打开，以下是格式：

vscode://rowewilsonfrederiskholme.wikitext/PullPage?RemoteBot=true&TransferProtocol=https%3A&SiteHost=%2F%2F$key$.huijiwiki.com&APIPath=%2Fw%2Fapi.php&Title=$fullpagename$

在该URL中：

  • $key$为你所在站点的 Wiki key，例如彩虹六号围攻站（r6s.huijiwiki.com）为r6s。
  • $fullpagename$为指定页面的完整名称，也就是如果有空间名应该加上空间名，比如说首页或者模板:Sandbox。

这里准备了一个简单的零件供搬运，可以和Github一样按下键盘上的小数点键（.）来调用：