feat: auto format markdown text(Ctrl-F)

按 Ctrl-F 自动格式化 Markdown 文章

Author: yanglbme

package.json

@@ -18,6 +18,7 @@
     "juice": "^6.0.0",
     "markdown": "^0.5.0",
     "marked": "^0.8.0",
+    "prettier": "^2.0.5",
     "prettify": "^0.1.7",
     "vue": "^2.6.10",
     "vue-router": "^3.1.3",

src/store/index.js

@@ -3,6 +3,8 @@ import Vuex from 'vuex'
 import config from '../scripts/config';
 import WxRenderer from '../scripts/renderers/wx-renderer'
 import marked from 'marked'
+import prettier from 'prettier/standalone'
+import prettierMarkdown from 'prettier/parser-markdown'
 import CodeMirror from 'codemirror/lib/codemirror'
 import DEFAULT_CONTENT from '../scripts/default-content'
 import DEFAULT_CSS_CONTENT from '../scripts/themes/default-theme-css'
@@ -70,15 +72,25 @@ const mutations = {
     },
     initEditorEntity(state) {
         state.editor = CodeMirror.fromTextArea(
-            document.getElementById('editor'), 
+            document.getElementById('editor'),
             {
                 value: '',
                 mode: 'text/x-markdown',
                 theme: 'xq-light',
                 lineNumbers: false,
                 lineWrapping: true,
                 styleActiveLine: true,
-                autoCloseBrackets: true
+                autoCloseBrackets: true,
+                extraKeys: {
+                    'Ctrl-F': function autoFormat(editor) {
+                        const doc = prettier.format(editor.getValue(0), {
+                            parser: 'markdown',
+                            plugins: [prettierMarkdown]
+                        })
+                        localStorage.setItem('__editor_content', doc)
+                        editor.setValue(doc)
+                    }
+                }
             }
         )
         // 如果有编辑器内容被保存则读取，否则加载默认内容
@@ -90,7 +102,8 @@ const mutations = {
     },
     initCssEditorEntity(state) {
         state.cssEditor = CodeMirror.fromTextArea(
-            document.getElementById('cssEditor'), {
+            document.getElementById('cssEditor'),
+            {
                 value: '',
                 mode: 'css',
                 theme: 'style-mirror',
@@ -99,10 +112,10 @@ const mutations = {
                 matchBrackets: true,
                 autofocus: true,
                 extraKeys: {
-                'Ctrl-F': function autoFormat(editor) {
-                    const totalLines = editor.lineCount()
+                    'Ctrl-F': function autoFormat(editor) {
+                        const totalLines = editor.lineCount()
 
-                    editor.autoFormatRange({
+                        editor.autoFormatRange({
                             line: 0,
                             ch: 0
                         }, {