Plugin Migration Guide from v3 to v4
View in MarkdownSourceIn v4, there are some breaking changes in its APIs. If you are a plugin author, please upgrade your plugins along with following instructions.
Example
Here are my commit logs to support v4:
Update engines.inkdrop field in package.json
Tell the app your plugin supports v4:
diff --git a/src/components/Navigation.jsx b/src/components/Navigation.jsx
index 36ad365..2f66ec2 100644
--- a/src/components/Navigation.jsx
+++ b/src/components/Navigation.jsx
@@ -222,6 +222,10 @@ export const navigation = [
title: 'Use ES modules in your plugin',
href: '/guides/es-modules',
},
+ {
+ title: 'List of commands',
+ href: '/guides/list-of-commands',
+ },
],
},
"engines": {
- "inkdrop": "^3.18.0"
+ "inkdrop": "^4.x"
},
Use markdownRenderer instead of MDEPreview
If your plugin adds a remark plugin to the markdown renderer, please change it as follows:
+ const { markdownRenderer } = require('inkdrop')
const breaks = require('remark-breaks')
module.exports = {
activate () {
- const { MDEPreview } = inkdrop.components.classes
- if (MDEPreview) {
- return MDEPreview.remarkPlugins.splice(0, 0, breaks)
- }
+ return markdownRenderer.remarkPlugins.splice(0, 0, breaks)
},
deactivate () {
- const { MDEPreview } = inkdrop.components.classes
- if (MDEPreview) {
- MDEPreview.remarkPlugins = MDEPreview.remarkPlugins.filter(function (plugin) {
- return plugin !== breaks
- })
+ if (markdownRenderer) {
+ markdownRenderer.remarkPlugins = markdownRenderer.remarkPlugins.filter(
+ plugin => {
+ return plugin !== breaks
+ }
+ )
+ }
}
}
Import codemirror directly
If your plugin extends CodeMirror module, please do so:
- import { CodeMirror } from 'inkdrop'
+ import CodeMirror from 'codemirror'
Change editor.codeMirror to editor.cm
I admit this breaking change does not make sense but please do so 😂:
const editor = global.inkdrop.getActiveEditor()
- const { codeMirror } = editor
+ const { cm } = editor
Call onEditorLoad
global.inkdrop provides a method called onEditorLoad to let you watch the editor load.
- global.inkdrop.on('editor:init', this.handleEditorInit.bind(this));
+ global.inkdrop.onEditorLoad(this.handleEditorInit.bind(this));
Still not working?
Please feel free to report issues on our forum!