diff --git a/.gitignore b/.gitignore
index e043bca..47fea0e 100644
--- a/.gitignore
+++ b/.gitignore
@@ -17,7 +17,6 @@
 .env.development.local
 .env.test.local
 .env.production.local
-.vscode
 
 npm-debug.log*
 yarn-debug.log*
diff --git a/.husky/pre-commit b/.husky/pre-commit
new file mode 100644
index 0000000..20d0d06
--- /dev/null
+++ b/.husky/pre-commit
@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+npm run lint
diff --git a/.vscode/settings.json b/.vscode/settings.json
new file mode 100644
index 0000000..eb3d18b
--- /dev/null
+++ b/.vscode/settings.json
@@ -0,0 +1,5 @@
+{
+  "editor.codeActionsOnSave": {
+    "source.fixAll": true
+  }
+}
diff --git a/jsconfig.json b/jsconfig.json
new file mode 100644
index 0000000..adc4845
--- /dev/null
+++ b/jsconfig.json
@@ -0,0 +1,9 @@
+{
+  "compilerOptions": {
+    "baseUrl": "./",
+    "paths": {
+      "@/*": ["src/*"]
+    }
+  },
+  "exclude": ["node_modules", "dist"]
+}
diff --git a/mm/mm.config.js b/mm/mm.config.js
index 9a15065..57c5e17 100644
--- a/mm/mm.config.js
+++ b/mm/mm.config.js
@@ -10,11 +10,11 @@ const spaceInfo = {
 }
 
 /**
- * 配置说明请参考文档: 
+ * 配置说明请参考文档:
  * https://hongqiye.com/doc/mockm/config/option.html
  * @type {import('mockm/@types/config').Config}
  */
-module.exports = util => {
+module.exports = (util) => {
   const port = 9000
   return {
     port,
@@ -29,26 +29,34 @@ module.exports = util => {
         })
         form.parse(req, async (err, fields = [], files) => {
           const file = files.file[0]
-          let url = `http://127.0.0.1:${port}/public/upload/${path.parse(file.path).base}`
+          let url = `http://127.0.0.1:${port}/public/upload/${
+            path.parse(file.path).base
+          }`
           try {
-            url = await dcloud(spaceInfo)({name: file.originalFilename, file: fs.createReadStream(file.path)})
+            url = await dcloud(spaceInfo)({
+              name: file.originalFilename,
+              file: fs.createReadStream(file.path),
+            })
           } catch (err) {
             // console.log(err)
           }
-          res.json({url})
+          res.json({ url })
         })
       },
     },
     static: [
-      { // 测试 netlify 部署
+      {
+        // 测试 netlify 部署
         fileDir: `../dist`,
         path: `/`,
       },
-      { // 测试 gitee/github 部署
+      {
+        // 测试 gitee/github 部署
         fileDir: `../dist`,
         path: `/md`,
       },
-      { // 访问公共目录
+      {
+        // 访问公共目录
         fileDir: `../public`,
         path: `/public`,
       },
diff --git a/mm/util.js b/mm/util.js
index 476211b..6b9608b 100644
--- a/mm/util.js
+++ b/mm/util.js
@@ -1,19 +1,23 @@
-const fetch = (...args) => import(`node-fetch`).then(({default: fetch}) => fetch(...args))
+const fetch = (...args) =>
+  import(`node-fetch`).then(({ default: fetch }) => fetch(...args))
 const FormData = require(`form-data`)
 
 function dcloud(spaceInfo) {
-  if(Boolean(spaceInfo.spaceId && spaceInfo.clientSecret) === false) {
+  if (Boolean(spaceInfo.spaceId && spaceInfo.clientSecret) === false) {
     throw new Error(`请填写 spaceInfo`)
   }
-  
+
   function sign(data, secret) {
     const hmac = require(`crypto`).createHmac(`md5`, secret)
     // 排序 obj 再转换为 key=val&key=val 的格式
-    const str = Object.keys(data).sort().reduce((acc, cur) => `${acc}&${cur}=${data[cur]}`, ``).slice(1)
+    const str = Object.keys(data)
+      .sort()
+      .reduce((acc, cur) => `${acc}&${cur}=${data[cur]}`, ``)
+      .slice(1)
     hmac.update(str)
     return hmac.digest(`hex`)
   }
-  
+
   async function anonymousAuthorize() {
     const data = {
       method: `serverless.auth.user.anonymousAuthorize`,
@@ -29,7 +33,7 @@ function dcloud(spaceInfo) {
       method: `POST`,
     }).then((res) => res.json())
   }
-  
+
   async function report({ id, token }) {
     const reportReq = {
       method: `serverless.file.resource.report`,
@@ -47,7 +51,7 @@ function dcloud(spaceInfo) {
       method: `POST`,
     }).then((res) => res.json())
   }
-  
+
   async function generateProximalSign({ name, token }) {
     const data = {
       method: `serverless.file.resource.generateProximalSign`,
@@ -66,7 +70,7 @@ function dcloud(spaceInfo) {
     }).then((res) => res.json())
     return res
   }
-  
+
   async function upload({ data, file }) {
     const formdata = new FormData()
     Object.entries({
@@ -81,7 +85,7 @@ function dcloud(spaceInfo) {
       success_action_status: 200,
       file,
     }).forEach(([key, val]) => formdata.append(key, val))
-  
+
     return await fetch(`https://${data.host}`, {
       headers: {
         'X-OSS-server-side-encrpytion': `AES256`,
@@ -90,7 +94,7 @@ function dcloud(spaceInfo) {
       method: `POST`,
     })
   }
-  
+
   async function uploadFile({ name = `unnamed.file`, file }) {
     const token = (await anonymousAuthorize()).data.accessToken
     const res = await generateProximalSign({ name, token })
@@ -99,9 +103,8 @@ function dcloud(spaceInfo) {
     const fileUrl = `https://${res.data.cdnDomain}/${res.data.ossPath}`
     return fileUrl
   }
-  
+
   return uploadFile
-  
 }
 
 module.exports = {
diff --git a/package.json b/package.json
index 1ff6527..995ec32 100644
--- a/package.json
+++ b/package.json
@@ -3,6 +3,8 @@
   "version": "1.5.7",
   "private": false,
   "scripts": {
+    "prepare": "husky install",
+    "lint": "vue-cli-service lint src && vue-cli-service lint mm",
     "start": "run-p serve mm",
     "serve": "vue-cli-service serve",
     "build:h5-netlify": "cross-env SERVER_ENV=NETLIFY vue-cli-service build",
@@ -10,6 +12,43 @@
     "build-cli": "npm run build && npx shx rm -rf md-cli/dist && npx shx rm -rf dist/**/*.map && npx shx cp -r dist md-cli/ && cd md-cli && npm pack",
     "mm": "npx mockm --cwd=mm"
   },
+  "eslintConfig": {
+    "root": true,
+    "env": {
+      "node": true
+    },
+    "extends": [
+      "plugin:vue/essential",
+      "eslint:recommended",
+      "@vue/prettier"
+    ],
+    "parserOptions": {
+      "parser": "babel-eslint"
+    },
+    "ignorePatterns": [
+      "src/assets/scripts/renderers"
+    ],
+    "rules": {
+      "prettier/prettier": [
+        "error",
+        {
+          "singleQuote": true,
+          "semi": false
+        }
+      ],
+      "semi": [
+        "error",
+        "never"
+      ],
+      "quotes": [
+        "error",
+        "backtick"
+      ],
+      "no-unused-vars": "off",
+      "no-console": "off",
+      "no-debugger": "off"
+    }
+  },
   "dependencies": {
     "@vue/shared": "^3.2.26",
     "ali-oss": "^6.16.0",
@@ -37,6 +76,15 @@
     "vuex": "^3.6.2"
   },
   "devDependencies": {
+    "@vue/cli-plugin-eslint": "^4.5.12",
+    "@vue/cli-plugin-router": "^4.5.12",
+    "@vue/cli-plugin-vuex": "^4.5.12",
+    "@vue/eslint-config-prettier": "^6.0.0",
+    "babel-eslint": "^10.1.0",
+    "eslint": "^6.8.0",
+    "eslint-plugin-prettier": "^3.4.0",
+    "eslint-plugin-vue": "^6.2.2",
+    "husky": "^7.0.4",
     "@vue/cli-plugin-babel": "~4.5.15",
     "@vue/cli-service": "~4.5.15",
     "async-validator": "^4.0.7",
diff --git a/src/App.vue b/src/App.vue
index 58c415c..eb28b05 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -18,8 +18,8 @@ body,
 
 <style lang="less">
 /* 每个页面公共css */
-@import url("./assets/less/style-mirror.css");
-@import url("./assets/less/theme.less");
+@import url('./assets/less/style-mirror.css');
+@import url('./assets/less/theme.less');
 
 ::-webkit-scrollbar {
   width: 6px;
diff --git a/src/api/config.js b/src/api/config.js
index 11c7b55..26cbd32 100644
--- a/src/api/config.js
+++ b/src/api/config.js
@@ -1,55 +1,55 @@
 const githubConfig = {
-  username: "filess",
+  username: `filess`,
   repoList: Array.from(
     [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19],
     (e) => `img${e}`
   ),
-  branch: "main",
+  branch: `main`,
   accessTokenList: [
-    "7715d7ca67b5d3837cfdoocsmde8c38421815aa423510af",
-    "c411415bf95dbe39625doocsmd5047ba9b7a2a6c9642abe",
-    "2821cd8819fa345c053doocsmdca86ac653f8bc20db1f1b",
-    "445f0dae46ef1f2a4d6doocsmdc797301e94797b4750a4c",
-    "cc1d0c1426d0fd0902bdoocsmdd2d7184b14da61b86ec46",
-    "b67e9d15cb6f910492fdoocsmdac6b44d379c953bb19eff",
-    "618c4dc2244ccbbc088doocsmd125d17fd31b7d06a50cf3",
-    "a4b581732e1c1507458doocsmdc5b223b27dae5e2e16a55",
-    "77904db41aee57ad79bdoocsmd760f848201dac9c96fd5e",
-    "02f251cb14ac62ab100doocsmdddbfc8527d773f1f04ce1",
-    "eb321079a95ba7028d9doocsmde2e84c502dac70de7cf08",
-    "22f74fcfb071a961fa2doocsmde28dabc746f0503a15e5d",
-    "85124c2bfe7abba0938doocsmd0af7f67918b99d085a5fd",
-    "0a561b4d4bbecb2de7edoocsmdd9ba3833d11dbc5e430f5",
-    "e8a01491188d8d5a097doocsmd03ede0aad1fe9e3af24e9",
-    "36e1f420d7e5bdebd67doocsmd65463562f5f25b20b8377",
+    `7715d7ca67b5d3837cfdoocsmde8c38421815aa423510af`,
+    `c411415bf95dbe39625doocsmd5047ba9b7a2a6c9642abe`,
+    `2821cd8819fa345c053doocsmdca86ac653f8bc20db1f1b`,
+    `445f0dae46ef1f2a4d6doocsmdc797301e94797b4750a4c`,
+    `cc1d0c1426d0fd0902bdoocsmdd2d7184b14da61b86ec46`,
+    `b67e9d15cb6f910492fdoocsmdac6b44d379c953bb19eff`,
+    `618c4dc2244ccbbc088doocsmd125d17fd31b7d06a50cf3`,
+    `a4b581732e1c1507458doocsmdc5b223b27dae5e2e16a55`,
+    `77904db41aee57ad79bdoocsmd760f848201dac9c96fd5e`,
+    `02f251cb14ac62ab100doocsmdddbfc8527d773f1f04ce1`,
+    `eb321079a95ba7028d9doocsmde2e84c502dac70de7cf08`,
+    `22f74fcfb071a961fa2doocsmde28dabc746f0503a15e5d`,
+    `85124c2bfe7abba0938doocsmd0af7f67918b99d085a5fd`,
+    `0a561b4d4bbecb2de7edoocsmdd9ba3833d11dbc5e430f5`,
+    `e8a01491188d8d5a097doocsmd03ede0aad1fe9e3af24e9`,
+    `36e1f420d7e5bdebd67doocsmd65463562f5f25b20b8377`,
   ],
-};
+}
 
 const giteeConfig = {
-  username: "filesss",
+  username: `filesss`,
   repoList: Array.from(
     [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19],
     (e) => `img${e}`
   ),
-  branch: "main",
+  branch: `main`,
   accessTokenList: [
-    "ed5fc9866bd6c2fdoocsmddd433f806fd2f399c",
-    "5448ffebbbf1151doocsmdc4e337cf814fc8a62",
-    "25b05efd2557ca2doocsmd75b5c0835e3395911",
-    "11628c7a5aef015doocsmd2eeff9fb9566f0458",
-    "cb2f5145ed938dedoocsmdbd063b4ed244eecf8",
-    "d8c0b57500672c1doocsmd55f48b866b5ebcd98",
-    "78c56eadb88e453doocsmd43ddd95753351771a",
-    "03e1a688003948fdoocsmda16fcf41e6f03f1f0",
-    "c49121cf4d191fbdoocsmdd6a7877ed537e474a",
-    "adfeb2fadcdc4aadoocsmdfe1ee869ac9c968ff",
-    "116c94549ca4a0ddoocsmd192653af5c0694616",
-    "ecf30ed7f2eb184doocsmd51ea4ec8300371d9e",
-    "5837cf2bd5afd93doocsmd73904bed31934949e",
-    "b5b7e1c7d57e01fdoocsmd5266f552574297d78",
-    "684d55564ffbd0bdoocsmd7d747e5cc23aed6d6",
-    "3fc04a9d272ab71doocsmd010c56cb57d88d2ba",
+    `ed5fc9866bd6c2fdoocsmddd433f806fd2f399c`,
+    `5448ffebbbf1151doocsmdc4e337cf814fc8a62`,
+    `25b05efd2557ca2doocsmd75b5c0835e3395911`,
+    `11628c7a5aef015doocsmd2eeff9fb9566f0458`,
+    `cb2f5145ed938dedoocsmdbd063b4ed244eecf8`,
+    `d8c0b57500672c1doocsmd55f48b866b5ebcd98`,
+    `78c56eadb88e453doocsmd43ddd95753351771a`,
+    `03e1a688003948fdoocsmda16fcf41e6f03f1f0`,
+    `c49121cf4d191fbdoocsmdd6a7877ed537e474a`,
+    `adfeb2fadcdc4aadoocsmdfe1ee869ac9c968ff`,
+    `116c94549ca4a0ddoocsmd192653af5c0694616`,
+    `ecf30ed7f2eb184doocsmd51ea4ec8300371d9e`,
+    `5837cf2bd5afd93doocsmd73904bed31934949e`,
+    `b5b7e1c7d57e01fdoocsmd5266f552574297d78`,
+    `684d55564ffbd0bdoocsmd7d747e5cc23aed6d6`,
+    `3fc04a9d272ab71doocsmd010c56cb57d88d2ba`,
   ],
-};
+}
 
-export { githubConfig, giteeConfig };
+export { githubConfig, giteeConfig }
diff --git a/src/api/fetch.js b/src/api/fetch.js
index c7312d4..5d6852a 100644
--- a/src/api/fetch.js
+++ b/src/api/fetch.js
@@ -1,30 +1,30 @@
-import axios from "axios";
+import axios from 'axios'
 
 // 创建axios实例
 const service = axios.create({
-  baseURL: "",
+  baseURL: ``,
   timeout: 30 * 1000, // 请求超时时间
-});
+})
 
 service.interceptors.request.use(
   (config) => {
     if (/^(post)|(put)|(delete)$/i.test(config.method)) {
       if (config.data && config.data.upload) {
-        config.headers["Content-Type"] = "multipart/form-data";
+        config.headers[`Content-Type`] = `multipart/form-data`
       }
     }
-    return config;
+    return config
   },
   (error) => {
-    Promise.reject(error);
+    Promise.reject(error)
   }
-);
+)
 
 service.interceptors.response.use(
   (res) => {
-    return res.data ? res.data : Promise.reject(res);
+    return res.data ? res.data : Promise.reject(res)
   },
   (error) => Promise.reject(error)
-);
+)
 
-export default service;
+export default service
diff --git a/src/api/file.js b/src/api/file.js
index 4c72c3d..c0ffd3f 100644
--- a/src/api/file.js
+++ b/src/api/file.js
@@ -1,47 +1,47 @@
-import fetch from "./fetch";
-import { githubConfig, giteeConfig } from "./config";
-import CryptoJS from "crypto-js";
-import OSS from "ali-oss";
-import * as Minio from "minio";
-import COS from "cos-js-sdk-v5";
-import Buffer from "buffer-from";
-import { v4 as uuidv4 } from "uuid";
-import * as qiniu from "qiniu-js";
-import { utf16to8, base64encode, safe64 } from "../assets/scripts/tokenTools";
-import * as tokenTools from "../assets/scripts/tokenTools";
+import fetch from './fetch'
+import { githubConfig, giteeConfig } from './config'
+import CryptoJS from 'crypto-js'
+import OSS from 'ali-oss'
+import * as Minio from 'minio'
+import COS from 'cos-js-sdk-v5'
+import Buffer from 'buffer-from'
+import { v4 as uuidv4 } from 'uuid'
+import * as qiniu from 'qiniu-js'
+import { utf16to8, base64encode, safe64 } from '../assets/scripts/tokenTools'
+import * as tokenTools from '../assets/scripts/tokenTools'
 
 function getConfig(useDefault, platform) {
   if (useDefault) {
     // load default config file
-    const config = platform === "github" ? githubConfig : giteeConfig;
-    const { username, repoList, branch, accessTokenList } = config;
+    const config = platform === `github` ? githubConfig : giteeConfig
+    const { username, repoList, branch, accessTokenList } = config
 
     // choose random token from access_token list
-    const tokenIndex = Math.floor(Math.random() * accessTokenList.length);
-    const accessToken = accessTokenList[tokenIndex].replace("doocsmd", "");
+    const tokenIndex = Math.floor(Math.random() * accessTokenList.length)
+    const accessToken = accessTokenList[tokenIndex].replace(`doocsmd`, ``)
 
     // choose random repo from repo list
-    const repoIndex = Math.floor(Math.random() * repoList.length);
-    const repo = repoList[repoIndex];
+    const repoIndex = Math.floor(Math.random() * repoList.length)
+    const repo = repoList[repoIndex]
 
-    return { username, repo, branch, accessToken };
+    return { username, repo, branch, accessToken }
   }
 
   // load configuration from localStorage
-  const customConfig = JSON.parse(localStorage.getItem(`${platform}Config`));
+  const customConfig = JSON.parse(localStorage.getItem(`${platform}Config`))
 
   // split username/repo
   const repoUrl = customConfig.repo
-    .replace(`https://${platform}.com/`, "")
-    .replace(`http://${platform}.com/`, "")
-    .replace(`${platform}.com/`, "")
-    .split("/");
+    .replace(`https://${platform}.com/`, ``)
+    .replace(`http://${platform}.com/`, ``)
+    .replace(`${platform}.com/`, ``)
+    .split(`/`)
   return {
     username: repoUrl[0],
     repo: repoUrl[1],
-    branch: customConfig.branch || "master",
+    branch: customConfig.branch || `master`,
     accessToken: customConfig.accessToken,
-  };
+  }
 }
 
 /**
@@ -49,11 +49,11 @@ function getConfig(useDefault, platform) {
  * @returns string
  */
 function getDir() {
-  const date = new Date();
-  const year = date.getFullYear();
-  const month = (date.getMonth() + 1).toString().padStart(2, "0");
-  const day = date.getDate().toString().padStart(2, "0");
-  return `${year}/${month}/${day}`;
+  const date = new Date()
+  const year = date.getFullYear()
+  const month = (date.getMonth() + 1).toString().padStart(2, `0`)
+  const day = date.getDate().toString().padStart(2, `0`)
+  return `${year}/${month}/${day}`
 }
 
 /**
@@ -62,9 +62,9 @@ function getDir() {
  * @returns
  */
 function getDateFilename(filename) {
-  const currentTimestamp = new Date().getTime();
-  const fileSuffix = filename.split(".")[1];
-  return `${currentTimestamp}-${uuidv4()}.${fileSuffix}`;
+  const currentTimestamp = new Date().getTime()
+  const fileSuffix = filename.split(`.`)[1]
+  return `${currentTimestamp}-${uuidv4()}.${fileSuffix}`
 }
 
 //-----------------------------------------------------------------------
@@ -72,17 +72,17 @@ function getDateFilename(filename) {
 //-----------------------------------------------------------------------
 
 async function ghFileUpload(content, filename) {
-  const useDefault = localStorage.getItem("imgHost") === "default";
+  const useDefault = localStorage.getItem(`imgHost`) === `default`
   const { username, repo, branch, accessToken } = getConfig(
     useDefault,
-    "github"
-  );
-  const dir = getDir();
-  const url = `https://api.github.com/repos/${username}/${repo}/contents/${dir}/`;
-  const dateFilename = getDateFilename(filename);
+    `github`
+  )
+  const dir = getDir()
+  const url = `https://api.github.com/repos/${username}/${repo}/contents/${dir}/`
+  const dateFilename = getDateFilename(filename)
   const res = await fetch({
     url: url + dateFilename,
-    method: "put",
+    method: `put`,
     headers: {
       Authorization: `token ${accessToken}`,
     },
@@ -91,13 +91,13 @@ async function ghFileUpload(content, filename) {
       branch,
       message: `Upload by ${window.location.href}`,
     },
-  });
-  const githubResourceUrl = `raw.githubusercontent.com/${username}/${repo}/${branch}/`;
-  const cdnResourceUrl = `cdn.jsdelivr.net/gh/${username}/${repo}@${branch}/`;
-  res.content = res.data?.content || res.content;
+  })
+  const githubResourceUrl = `raw.githubusercontent.com/${username}/${repo}/${branch}/`
+  const cdnResourceUrl = `cdn.jsdelivr.net/gh/${username}/${repo}@${branch}/`
+  res.content = res.data?.content || res.content
   return useDefault
     ? res.content.download_url.replace(githubResourceUrl, cdnResourceUrl)
-    : res.content.download_url;
+    : res.content.download_url
 }
 
 //-----------------------------------------------------------------------
@@ -105,26 +105,23 @@ async function ghFileUpload(content, filename) {
 //-----------------------------------------------------------------------
 
 async function giteeUpload(content, filename) {
-  const useDefault = localStorage.getItem("imgHost") === "default";
-  const { username, repo, branch, accessToken } = getConfig(
-    useDefault,
-    "gitee"
-  );
-  const dir = getDir();
-  const dateFilename = getDateFilename(filename);
-  const url = `https://gitee.com/api/v5/repos/${username}/${repo}/contents/${dir}/${dateFilename}`;
+  const useDefault = localStorage.getItem(`imgHost`) === `default`
+  const { username, repo, branch, accessToken } = getConfig(useDefault, `gitee`)
+  const dir = getDir()
+  const dateFilename = getDateFilename(filename)
+  const url = `https://gitee.com/api/v5/repos/${username}/${repo}/contents/${dir}/${dateFilename}`
   const res = await fetch({
     url,
-    method: "POST",
+    method: `POST`,
     data: {
       content,
       branch,
       access_token: accessToken,
       message: `Upload by ${window.location.href}`,
     },
-  });
-  res.content = res.data?.content || res.content;
-  return encodeURI(res.content.download_url);
+  })
+  res.content = res.data?.content || res.content
+  return encodeURI(res.content.download_url)
 }
 
 //-----------------------------------------------------------------------
@@ -132,37 +129,37 @@ async function giteeUpload(content, filename) {
 //-----------------------------------------------------------------------
 
 function getQiniuToken(accessKey, secretKey, putPolicy) {
-  const policy = JSON.stringify(putPolicy);
-  const encoded = base64encode(utf16to8(policy));
-  const hash = CryptoJS.HmacSHA1(encoded, secretKey);
-  const encodedSigned = hash.toString(CryptoJS.enc.Base64);
-  return `${accessKey}:${safe64(encodedSigned)}:${encoded}`;
+  const policy = JSON.stringify(putPolicy)
+  const encoded = base64encode(utf16to8(policy))
+  const hash = CryptoJS.HmacSHA1(encoded, secretKey)
+  const encodedSigned = hash.toString(CryptoJS.enc.Base64)
+  return `${accessKey}:${safe64(encodedSigned)}:${encoded}`
 }
 
 async function qiniuUpload(file) {
   const { accessKey, secretKey, bucket, region, path, domain } = JSON.parse(
-    localStorage.getItem("qiniuConfig")
-  );
+    localStorage.getItem(`qiniuConfig`)
+  )
   const token = getQiniuToken(accessKey, secretKey, {
     scope: bucket,
     deadline: Math.trunc(new Date().getTime() / 1000) + 3600,
-  });
-  const dir = path ? `${path}/` : "";
-  const dateFilename = dir + getDateFilename(file.name);
-  const observable = qiniu.upload(file, dateFilename, token, {}, { region });
+  })
+  const dir = path ? `${path}/` : ``
+  const dateFilename = dir + getDateFilename(file.name)
+  const observable = qiniu.upload(file, dateFilename, token, {}, { region })
   return new Promise((resolve, reject) => {
     observable.subscribe({
       next: (result) => {
-        console.log(result);
+        console.log(result)
       },
       error: (err) => {
-        reject(err.message);
+        reject(err.message)
       },
       complete: (result) => {
-        resolve(`${domain}/${result.key}`);
+        resolve(`${domain}/${result.key}`)
       },
-    });
-  });
+    })
+  })
 }
 
 //-----------------------------------------------------------------------
@@ -170,23 +167,23 @@ async function qiniuUpload(file) {
 //-----------------------------------------------------------------------
 
 async function aliOSSFileUpload(content, filename) {
-  const dateFilename = getDateFilename(filename);
+  const dateFilename = getDateFilename(filename)
   const { region, bucket, accessKeyId, accessKeySecret, cdnHost, path } =
-    JSON.parse(localStorage.getItem("aliOSSConfig"));
-  const buffer = Buffer(content, "base64");
-  const dir = `${path}/${dateFilename}`;
+    JSON.parse(localStorage.getItem(`aliOSSConfig`))
+  const buffer = Buffer(content, `base64`)
+  const dir = `${path}/${dateFilename}`
   const client = new OSS({
     region,
     bucket,
     accessKeyId,
     accessKeySecret,
-  });
+  })
   try {
-    const res = await client.put(dir, buffer);
-    if (cdnHost === "") return res.url;
-    return `${cdnHost}/${path === "" ? dateFilename : dir}`;
+    const res = await client.put(dir, buffer)
+    if (cdnHost === ``) return res.url
+    return `${cdnHost}/${path === `` ? dateFilename : dir}`
   } catch (e) {
-    return Promise.reject(e);
+    return Promise.reject(e)
   }
 }
 
@@ -195,14 +192,14 @@ async function aliOSSFileUpload(content, filename) {
 //-----------------------------------------------------------------------
 
 async function txCOSFileUpload(file) {
-  const dateFilename = getDateFilename(file.name);
+  const dateFilename = getDateFilename(file.name)
   const { secretId, secretKey, bucket, region, path, cdnHost } = JSON.parse(
-    localStorage.getItem("txCOSConfig")
-  );
+    localStorage.getItem(`txCOSConfig`)
+  )
   const cos = new COS({
     SecretId: secretId,
     SecretKey: secretKey,
-  });
+  })
   return new Promise((resolve, reject) => {
     cos.putObject(
       {
@@ -213,19 +210,19 @@ async function txCOSFileUpload(file) {
       },
       function (err, data) {
         if (err) {
-          reject(err);
+          reject(err)
         } else if (cdnHost) {
           resolve(
-            path == ""
+            path == ``
               ? `${cdnHost}/${dateFilename}`
               : `${cdnHost}/${path}/${dateFilename}`
-          );
+          )
         } else {
-          resolve(`https://${data.Location}`);
+          resolve(`https://${data.Location}`)
         }
       }
-    );
-  });
+    )
+  })
 }
 
 //-----------------------------------------------------------------------
@@ -233,41 +230,41 @@ async function txCOSFileUpload(file) {
 //-----------------------------------------------------------------------
 
 async function minioFileUpload(content, filename) {
-  const dateFilename = getDateFilename(filename);
+  const dateFilename = getDateFilename(filename)
   const { endpoint, port, useSSL, bucket, accessKey, secretKey } = JSON.parse(
-    localStorage.getItem("minioConfig")
-  );
-  const buffer = Buffer(content, "base64");
+    localStorage.getItem(`minioConfig`)
+  )
+  const buffer = Buffer(content, `base64`)
   const conf = {
     endPoint: endpoint,
     useSSL: useSSL,
     accessKey: accessKey,
     secretKey: secretKey,
-  };
-  const p = Number(port || 0);
-  const isCustomPort = p > 0 && p !== 80 && p !== 443;
+  }
+  const p = Number(port || 0)
+  const isCustomPort = p > 0 && p !== 80 && p !== 443
   if (isCustomPort) {
-    conf.port = p;
+    conf.port = p
   }
   return new Promise((resolve, reject) => {
-    const minioClient = new Minio.Client(conf);
+    const minioClient = new Minio.Client(conf)
     try {
       minioClient.putObject(bucket, dateFilename, buffer, function (e) {
         if (e) {
-          reject(e);
+          reject(e)
         }
-        const host = `${useSSL ? "https://" : "http://"}${endpoint}${
-          isCustomPort ? ":" + port : ""
-        }`;
-        const url = `${host}/${bucket}/${dateFilename}`;
+        const host = `${useSSL ? `https://` : `http://`}${endpoint}${
+          isCustomPort ? `:` + port : ``
+        }`
+        const url = `${host}/${bucket}/${dateFilename}`
         // console.log("文件上传成功: ", url)
-        resolve(url);
+        resolve(url)
         // return `${endpoint}/${bucket}/${dateFilename}`;
-      });
+      })
     } catch (e) {
-      reject(e);
+      reject(e)
     }
-  });
+  })
 }
 
 //-----------------------------------------------------------------------
@@ -279,7 +276,7 @@ async function formCustomUpload(content, file) {
     async (CUSTOM_ARG) => {
       ${localStorage.getItem(`formCustomConfig`)}
     }
-  `;
+  `
   return new Promise((resolve, reject) => {
     const exportObj = {
       content, // 待上传图片的 base64
@@ -298,40 +295,40 @@ async function formCustomUpload(content, file) {
       },
       okCb: resolve, // 重要: 上传成功后给此回调传 url 即可
       errCb: reject, // 上传失败调用的函数
-    };
+    }
     eval(str)(exportObj).catch((err) => {
-      console.error(err);
-      reject(err);
-    });
-  });
+      console.error(err)
+      reject(err)
+    })
+  })
 }
 
 function fileUpload(content, file) {
-  const imgHost = localStorage.getItem("imgHost");
-  !imgHost && localStorage.setItem("imgHost", "default");
+  const imgHost = localStorage.getItem(`imgHost`)
+  !imgHost && localStorage.setItem(`imgHost`, `default`)
   switch (imgHost) {
-    case "aliOSS":
-      return aliOSSFileUpload(content, file.name);
-    case "minio":
-      return minioFileUpload(content, file.name);
-    case "txCOS":
-      return txCOSFileUpload(file);
-    case "qiniu":
-      return qiniuUpload(file);
-    case "gitee":
-      return giteeUpload(content, file.name);
-    case "github":
-      return ghFileUpload(content, file.name);
-    case "formCustom":
-      return formCustomUpload(content, file);
+    case `aliOSS`:
+      return aliOSSFileUpload(content, file.name)
+    case `minio`:
+      return minioFileUpload(content, file.name)
+    case `txCOS`:
+      return txCOSFileUpload(file)
+    case `qiniu`:
+      return qiniuUpload(file)
+    case `gitee`:
+      return giteeUpload(content, file.name)
+    case `github`:
+      return ghFileUpload(content, file.name)
+    case `formCustom`:
+      return formCustomUpload(content, file)
     default:
       // return file.size / 1024 < 1024
       //     ? giteeUpload(content, file.name)
       //     : ghFileUpload(content, file.name);
-      return ghFileUpload(content, file.name);
+      return ghFileUpload(content, file.name)
   }
 }
 
 export default {
   fileUpload,
-};
+}
diff --git a/src/assets/scripts/config.js b/src/assets/scripts/config.js
index f56bc28..e498e47 100644
--- a/src/assets/scripts/config.js
+++ b/src/assets/scripts/config.js
@@ -1,89 +1,87 @@
 export default {
   builtinFonts: [
     {
-      label: "无衬线",
-      value:
-        "-apple-system-font,BlinkMacSystemFont, Helvetica Neue, PingFang SC, Hiragino Sans GB , Microsoft YaHei UI , Microsoft YaHei ,Arial,sans-serif",
+      label: `无衬线`,
+      value: `-apple-system-font,BlinkMacSystemFont, Helvetica Neue, PingFang SC, Hiragino Sans GB , Microsoft YaHei UI , Microsoft YaHei ,Arial,sans-serif`,
     },
     {
-      label: "衬线",
-      value:
-        "Optima-Regular, Optima, PingFangSC-light, PingFangTC-light, 'PingFang SC', Cambria, Cochin, Georgia, Times, 'Times New Roman', serif",
+      label: `衬线`,
+      value: `Optima-Regular, Optima, PingFangSC-light, PingFangTC-light, 'PingFang SC', Cambria, Cochin, Georgia, Times, 'Times New Roman', serif`,
     },
   ],
   sizeOption: [
     {
-      label: "12px",
-      value: "12px",
-      desc: "更小",
+      label: `12px`,
+      value: `12px`,
+      desc: `更小`,
     },
     {
-      label: "13px",
-      value: "13px",
-      desc: "稍小",
+      label: `13px`,
+      value: `13px`,
+      desc: `稍小`,
     },
     {
-      label: "14px",
-      value: "14px",
-      desc: "推荐",
+      label: `14px`,
+      value: `14px`,
+      desc: `推荐`,
     },
     {
-      label: "15px",
-      value: "15px",
-      desc: "稍大",
+      label: `15px`,
+      value: `15px`,
+      desc: `稍大`,
     },
     {
-      label: "16px",
-      value: "16px",
-      desc: "更大",
+      label: `16px`,
+      value: `16px`,
+      desc: `更大`,
     },
   ],
   colorOption: [
     {
-      label: "经典蓝",
-      value: "rgba(15, 76, 129, 1)",
-      desc: "最新流行",
+      label: `经典蓝`,
+      value: `rgba(15, 76, 129, 1)`,
+      desc: `最新流行`,
     },
     {
-      label: "翡翠绿",
-      value: "rgba(0, 152, 116, 1)",
-      desc: "优雅清新",
+      label: `翡翠绿`,
+      value: `rgba(0, 152, 116, 1)`,
+      desc: `优雅清新`,
     },
     {
-      label: "活力橘",
-      value: "rgba(250, 81, 81, 1)",
-      desc: "热情活泼",
+      label: `活力橘`,
+      value: `rgba(250, 81, 81, 1)`,
+      desc: `热情活泼`,
     },
   ],
   codeThemeOption: [
     {
-      label: "github",
-      value: "https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.4.0/styles/github.min.css",
-      desc: "light",
+      label: `github`,
+      value: `https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.4.0/styles/github.min.css`,
+      desc: `light`,
     },
     {
-      label: "solarized-light",
-      value: "https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.4.0/styles/base16/solarized-light.min.css",
-      desc: "light",
+      label: `solarized-light`,
+      value: `https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.4.0/styles/base16/solarized-light.min.css`,
+      desc: `light`,
     },
     {
-      label: "atom-one-dark",
-      value: "https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.4.0/styles/atom-one-dark.min.css",
-      desc: "dark",
+      label: `atom-one-dark`,
+      value: `https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.4.0/styles/atom-one-dark.min.css`,
+      desc: `dark`,
     },
     {
-      label: "obsidian",
-      value: "https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.4.0/styles/obsidian.min.css",
-      desc: "dark",
+      label: `obsidian`,
+      value: `https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.4.0/styles/obsidian.min.css`,
+      desc: `dark`,
     },
     {
-      label: "vs2015",
-      value: "https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.4.0/styles/vs2015.min.css",
-      desc: "dark",
+      label: `vs2015`,
+      value: `https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.4.0/styles/vs2015.min.css`,
+      desc: `dark`,
     },
   ],
   form: {
     rows: 1,
     cols: 1,
   },
-};
+}
diff --git a/src/assets/scripts/converter.js b/src/assets/scripts/converter.js
index 1d29eb8..0cf017d 100644
--- a/src/assets/scripts/converter.js
+++ b/src/assets/scripts/converter.js
@@ -1,25 +1,25 @@
-import juice from "juice";
+import juice from 'juice'
 
 export function solveWeChatImage() {
-  const clipboardDiv = document.getElementById("output");
-  const images = clipboardDiv.getElementsByTagName("img");
+  const clipboardDiv = document.getElementById(`output`)
+  const images = clipboardDiv.getElementsByTagName(`img`)
   for (let i = 0; i < images.length; i++) {
-    const image = images[i];
-    const width = image.getAttribute("width");
-    const height = image.getAttribute("height");
-    image.removeAttribute("width");
-    image.removeAttribute("height");
-    image.style.width = width;
-    image.style.height = height;
+    const image = images[i]
+    const width = image.getAttribute(`width`)
+    const height = image.getAttribute(`height`)
+    image.removeAttribute(`width`)
+    image.removeAttribute(`height`)
+    image.style.width = width
+    image.style.height = height
   }
 }
 export function solveHtml() {
-  const element = document.getElementById("output-wrapper");
-  let html = element.innerHTML;
-  let res = "";
+  const element = document.getElementById(`output-wrapper`)
+  let html = element.innerHTML
+  let res = ``
   res = juice.inlineContent(html, {
     inlinePseudoElements: true,
     preserveImportant: true,
-  });
-  return res;
+  })
+  return res
 }
diff --git a/src/assets/scripts/themes/default-theme.js b/src/assets/scripts/themes/default-theme.js
index f42d115..7091b26 100644
--- a/src/assets/scripts/themes/default-theme.js
+++ b/src/assets/scripts/themes/default-theme.js
@@ -1,192 +1,192 @@
-let baseColor = "#3f3f3f"
+let baseColor = `#3f3f3f`
 
 export default {
   BASE: {
-    "text-align": "left",
-    "line-height": "1.75"
+    'text-align': `left`,
+    'line-height': `1.75`,
   },
   block: {
     // 一级标题样式
     h1: {
-      "font-size": "1.2em",
-      "text-align": "center",
-      "font-weight": "bold",
-      display: "table",
-      margin: "2em auto 1em",
-      padding: "0 1em",
-      "border-bottom": "2px solid rgba(0, 152, 116, 0.9)",
+      'font-size': `1.2em`,
+      'text-align': `center`,
+      'font-weight': `bold`,
+      display: `table`,
+      margin: `2em auto 1em`,
+      padding: `0 1em`,
+      'border-bottom': `2px solid rgba(0, 152, 116, 0.9)`,
       color: baseColor,
     },
 
     // 二级标题样式
     h2: {
-      "font-size": "1.2em",
-      "text-align": "center",
-      "font-weight": "bold",
-      display: "table",
-      margin: "4em auto 2em",
-      padding: "0 0.2em",
-      background: "rgba(0, 152, 116, 0.9)",
-      color: "#fff",
+      'font-size': `1.2em`,
+      'text-align': `center`,
+      'font-weight': `bold`,
+      display: `table`,
+      margin: `4em auto 2em`,
+      padding: `0 0.2em`,
+      background: `rgba(0, 152, 116, 0.9)`,
+      color: `#fff`,
     },
 
     // 三级标题样式
     h3: {
-      "font-weight": "bold",
-      "font-size": "1.1em",
-      margin: "2em 8px 0.75em 0",
-      "line-height": "1.2",
-      "padding-left": "8px",
-      "border-left": "3px solid rgba(0, 152, 116, 0.9)",
+      'font-weight': `bold`,
+      'font-size': `1.1em`,
+      margin: `2em 8px 0.75em 0`,
+      'line-height': `1.2`,
+      'padding-left': `8px`,
+      'border-left': `3px solid rgba(0, 152, 116, 0.9)`,
       color: baseColor,
     },
 
     // 四级标题样式
     h4: {
-      "font-weight": "bold",
-      "font-size": "1em",
-      margin: "2em 8px 0.5em",
-      color: "rgba(66, 185, 131, 0.9)",
+      'font-weight': `bold`,
+      'font-size': `1em`,
+      margin: `2em 8px 0.5em`,
+      color: `rgba(66, 185, 131, 0.9)`,
     },
 
     // 段落样式
     p: {
-      margin: "1.5em 8px",
-      "letter-spacing": "0.1em",
+      margin: `1.5em 8px`,
+      'letter-spacing': `0.1em`,
       color: baseColor,
     },
 
     // 引用样式
     blockquote: {
-      "font-style": "normal",
-      "border-left": "none",
-      padding: "1em",
-      "border-radius": "8px",
-      color: "rgba(0,0,0,0.5)",
-      background: "#f7f7f7",
-      margin: "2em 8px",
+      'font-style': `normal`,
+      'border-left': `none`,
+      padding: `1em`,
+      'border-radius': `8px`,
+      color: `rgba(0,0,0,0.5)`,
+      background: `#f7f7f7`,
+      margin: `2em 8px`,
     },
 
     blockquote_p: {
-      "letter-spacing": "0.1em",
-      color: "rgb(80, 80, 80)",
-      "font-size": "1em",
-      display: "block",
+      'letter-spacing': `0.1em`,
+      color: `rgb(80, 80, 80)`,
+      'font-size': `1em`,
+      display: `block`,
     },
     code_pre: {
-      "font-size": "14px",
-      "overflow-x": "auto",
-      "border-radius": "8px",
-      padding: "1em",
-      "line-height": "1.5",
-      margin: "10px 8px"
+      'font-size': `14px`,
+      'overflow-x': `auto`,
+      'border-radius': `8px`,
+      padding: `1em`,
+      'line-height': `1.5`,
+      margin: `10px 8px`,
     },
     code: {
-      "margin": 0,
-      "white-space": "nowrap",
-      "font-family": "Menlo, Operator Mono, Consolas, Monaco, monospace"
+      margin: 0,
+      'white-space': `nowrap`,
+      'font-family': `Menlo, Operator Mono, Consolas, Monaco, monospace`,
     },
-  
+
     image: {
-      "border-radius": "4px",
-      display: "block",
-      margin: "0.1em auto 0.5em",
-      width: "100% !important",
+      'border-radius': `4px`,
+      display: `block`,
+      margin: `0.1em auto 0.5em`,
+      width: `100% !important`,
     },
 
     ol: {
-      "margin-left": "0",
-      "padding-left": "1em",
+      'margin-left': `0`,
+      'padding-left': `1em`,
       color: baseColor,
     },
 
     ul: {
-      "margin-left": "0",
-      "padding-left": "1em",
-      "list-style": "circle",
+      'margin-left': `0`,
+      'padding-left': `1em`,
+      'list-style': `circle`,
       color: baseColor,
     },
 
     footnotes: {
-      margin: "0.5em 8px",
-      "font-size": "80%",
+      margin: `0.5em 8px`,
+      'font-size': `80%`,
       color: baseColor,
     },
 
     figure: {
-      margin: "1.5em 8px",
+      margin: `1.5em 8px`,
       color: baseColor,
     },
     hr: {
-      "border-style": "solid",
-      "border-width": "1px 0 0",
-      "border-color": "rgba(0,0,0,0.1)",
-      "-webkit-transform-origin": "0 0",
-      "-webkit-transform": "scale(1, 0.5)",
-      "transform-origin": "0 0",
-      transform: "scale(1, 0.5)",
+      'border-style': `solid`,
+      'border-width': `1px 0 0`,
+      'border-color': `rgba(0,0,0,0.1)`,
+      '-webkit-transform-origin': `0 0`,
+      '-webkit-transform': `scale(1, 0.5)`,
+      'transform-origin': `0 0`,
+      transform: `scale(1, 0.5)`,
     },
   },
   inline: {
     listitem: {
-      "text-indent": "-1em",
-      display: "block",
-      margin: "0.2em 8px",
+      'text-indent': `-1em`,
+      display: `block`,
+      margin: `0.2em 8px`,
       color: baseColor,
     },
 
     codespan: {
-      "font-size": "90%",
-      "white-space": "pre",
-      color: "#d14",
-      background: "rgba(27,31,35,.05)",
-      padding: "3px 5px",
-      "border-radius": "4px",
+      'font-size': `90%`,
+      'white-space': `pre`,
+      color: `#d14`,
+      background: `rgba(27,31,35,.05)`,
+      padding: `3px 5px`,
+      'border-radius': `4px`,
     },
 
     link: {
-      color: "#576b95",
+      color: `#576b95`,
     },
 
     wx_link: {
-      color: "#576b95",
-      "text-decoration": "none",
+      color: `#576b95`,
+      'text-decoration': `none`,
     },
 
     // 字体加粗样式
     strong: {
-      color: "rgba(15, 76, 129, 0.9)",
-      "font-weight": "bold",
+      color: `rgba(15, 76, 129, 0.9)`,
+      'font-weight': `bold`,
     },
 
     table: {
-      "border-collapse": "collapse",
-      "text-align": "center",
-      margin: "1em 8px",
+      'border-collapse': `collapse`,
+      'text-align': `center`,
+      margin: `1em 8px`,
       color: baseColor,
     },
 
     thead: {
-      background: "rgba(0, 0, 0, 0.05)",
-      "font-weight": "bold",
+      background: `rgba(0, 0, 0, 0.05)`,
+      'font-weight': `bold`,
       color: baseColor,
     },
 
     td: {
-      border: "1px solid #dfdfdf",
-      padding: "0.25em 0.5em",
+      border: `1px solid #dfdfdf`,
+      padding: `0.25em 0.5em`,
       color: baseColor,
     },
 
     footnote: {
-      "font-size": "12px",
+      'font-size': `12px`,
       color: baseColor,
     },
 
     figcaption: {
-      "text-align": "center",
-      color: "#888",
-      "font-size": "0.8em",
+      'text-align': `center`,
+      color: `#888`,
+      'font-size': `0.8em`,
     },
   },
-};
+}
diff --git a/src/assets/scripts/tokenTools.js b/src/assets/scripts/tokenTools.js
index 578a655..39b48df 100644
--- a/src/assets/scripts/tokenTools.js
+++ b/src/assets/scripts/tokenTools.js
@@ -1,31 +1,31 @@
 export function utf16to8(str) {
-  var out, i, len, c;
-  out = "";
-  len = str.length;
+  var out, i, len, c
+  out = ``
+  len = str.length
   for (i = 0; i < len; i++) {
-    c = str.charCodeAt(i);
+    c = str.charCodeAt(i)
     if (c >= 0x0001 && c <= 0x007f) {
-      out += str.charAt(i);
+      out += str.charAt(i)
     } else if (c > 0x07ff) {
-      out += String.fromCharCode(0xe0 | ((c >> 12) & 0x0f));
-      out += String.fromCharCode(0x80 | ((c >> 6) & 0x3f));
-      out += String.fromCharCode(0x80 | ((c >> 0) & 0x3f));
+      out += String.fromCharCode(0xe0 | ((c >> 12) & 0x0f))
+      out += String.fromCharCode(0x80 | ((c >> 6) & 0x3f))
+      out += String.fromCharCode(0x80 | ((c >> 0) & 0x3f))
     } else {
-      out += String.fromCharCode(0xc0 | ((c >> 6) & 0x1f));
-      out += String.fromCharCode(0x80 | ((c >> 0) & 0x3f));
+      out += String.fromCharCode(0xc0 | ((c >> 6) & 0x1f))
+      out += String.fromCharCode(0x80 | ((c >> 0) & 0x3f))
     }
   }
-  return out;
+  return out
 }
 
 export function utf8to16(str) {
-  var out, i, len, c;
-  var char2, char3;
-  out = "";
-  len = str.length;
-  i = 0;
+  var out, i, len, c
+  var char2, char3
+  out = ``
+  len = str.length
+  i = 0
   while (i < len) {
-    c = str.charCodeAt(i++);
+    c = str.charCodeAt(i++)
     switch (c >> 4) {
       case 0:
       case 1:
@@ -36,29 +36,28 @@ export function utf8to16(str) {
       case 6:
       case 7:
         // 0xxxxxxx
-        out += str.charAt(i - 1);
-        break;
+        out += str.charAt(i - 1)
+        break
       case 12:
       case 13:
         // 110x xxxx 10xx xxxx
-        char2 = str.charCodeAt(i++);
-        out += String.fromCharCode(((c & 0x1f) << 6) | (char2 & 0x3f));
-        break;
+        char2 = str.charCodeAt(i++)
+        out += String.fromCharCode(((c & 0x1f) << 6) | (char2 & 0x3f))
+        break
       case 14:
         // 1110 xxxx 10xx xxxx 10xx xxxx
-        char2 = str.charCodeAt(i++);
-        char3 = str.charCodeAt(i++);
+        char2 = str.charCodeAt(i++)
+        char3 = str.charCodeAt(i++)
         out += String.fromCharCode(
           ((c & 0x0f) << 12) | ((char2 & 0x3f) << 6) | ((char3 & 0x3f) << 0)
-        );
-        break;
+        )
+        break
     }
   }
-  return out;
+  return out
 }
 
-const base64EncodeChars =
-  "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789-_";
+const base64EncodeChars = `ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789-_`
 const base64DecodeChars = new Array(
   -1,
   -1,
@@ -188,78 +187,78 @@ const base64DecodeChars = new Array(
   -1,
   -1,
   -1
-);
+)
 export function base64encode(str) {
-  var out, i, len;
-  var c1, c2, c3;
-  len = str.length;
-  i = 0;
-  out = "";
+  var out, i, len
+  var c1, c2, c3
+  len = str.length
+  i = 0
+  out = ``
   while (i < len) {
-    c1 = str.charCodeAt(i++) & 0xff;
+    c1 = str.charCodeAt(i++) & 0xff
     if (i == len) {
-      out += base64EncodeChars.charAt(c1 >> 2);
-      out += base64EncodeChars.charAt((c1 & 0x3) << 4);
-      out += "==";
-      break;
+      out += base64EncodeChars.charAt(c1 >> 2)
+      out += base64EncodeChars.charAt((c1 & 0x3) << 4)
+      out += `==`
+      break
     }
-    c2 = str.charCodeAt(i++);
+    c2 = str.charCodeAt(i++)
     if (i == len) {
-      out += base64EncodeChars.charAt(c1 >> 2);
-      out += base64EncodeChars.charAt(((c1 & 0x3) << 4) | ((c2 & 0xf0) >> 4));
-      out += base64EncodeChars.charAt((c2 & 0xf) << 2);
-      out += "=";
-      break;
+      out += base64EncodeChars.charAt(c1 >> 2)
+      out += base64EncodeChars.charAt(((c1 & 0x3) << 4) | ((c2 & 0xf0) >> 4))
+      out += base64EncodeChars.charAt((c2 & 0xf) << 2)
+      out += `=`
+      break
     }
-    c3 = str.charCodeAt(i++);
-    out += base64EncodeChars.charAt(c1 >> 2);
-    out += base64EncodeChars.charAt(((c1 & 0x3) << 4) | ((c2 & 0xf0) >> 4));
-    out += base64EncodeChars.charAt(((c2 & 0xf) << 2) | ((c3 & 0xc0) >> 6));
-    out += base64EncodeChars.charAt(c3 & 0x3f);
+    c3 = str.charCodeAt(i++)
+    out += base64EncodeChars.charAt(c1 >> 2)
+    out += base64EncodeChars.charAt(((c1 & 0x3) << 4) | ((c2 & 0xf0) >> 4))
+    out += base64EncodeChars.charAt(((c2 & 0xf) << 2) | ((c3 & 0xc0) >> 6))
+    out += base64EncodeChars.charAt(c3 & 0x3f)
   }
-  return out;
+  return out
 }
 
 export function base64decode(str) {
-  var c1, c2, c3, c4;
-  var i, len, out;
-  len = str.length;
-  i = 0;
-  out = "";
+  var c1, c2, c3, c4
+  var i, len, out
+  len = str.length
+  i = 0
+  out = ``
   while (i < len) {
     /* c1 */
     do {
-      c1 = base64DecodeChars[str.charCodeAt(i++) & 0xff];
-    } while (i < len && c1 == -1);
-    if (c1 == -1) break;
+      c1 = base64DecodeChars[str.charCodeAt(i++) & 0xff]
+    } while (i < len && c1 == -1)
+    if (c1 == -1) break
     /* c2 */
     do {
-      c2 = base64DecodeChars[str.charCodeAt(i++) & 0xff];
-    } while (i < len && c2 == -1);
-    if (c2 == -1) break;
-    out += String.fromCharCode((c1 << 2) | ((c2 & 0x30) >> 4));
+      c2 = base64DecodeChars[str.charCodeAt(i++) & 0xff]
+    } while (i < len && c2 == -1)
+    if (c2 == -1) break
+    out += String.fromCharCode((c1 << 2) | ((c2 & 0x30) >> 4))
     /* c3 */
     do {
-      c3 = str.charCodeAt(i++) & 0xff;
-      if (c3 == 61) return out;
-      c3 = base64DecodeChars[c3];
-    } while (i < len && c3 == -1);
-    if (c3 == -1) break;
-    out += String.fromCharCode(((c2 & 0xf) << 4) | ((c3 & 0x3c) >> 2));
+      c3 = str.charCodeAt(i++) & 0xff
+      if (c3 == 61) return out
+      c3 = base64DecodeChars[c3]
+    } while (i < len && c3 == -1)
+    if (c3 == -1) break
+    out += String.fromCharCode(((c2 & 0xf) << 4) | ((c3 & 0x3c) >> 2))
     /* c4 */
     do {
-      c4 = str.charCodeAt(i++) & 0xff;
-      if (c4 == 61) return out;
-      c4 = base64DecodeChars[c4];
-    } while (i < len && c4 == -1);
-    if (c4 == -1) break;
-    out += String.fromCharCode(((c3 & 0x03) << 6) | c4);
+      c4 = str.charCodeAt(i++) & 0xff
+      if (c4 == 61) return out
+      c4 = base64DecodeChars[c4]
+    } while (i < len && c4 == -1)
+    if (c4 == -1) break
+    out += String.fromCharCode(((c3 & 0x03) << 6) | c4)
   }
-  return out;
+  return out
 }
 
 export function safe64(base64) {
-  base64 = base64.replace(/\+/g, "-");
-  base64 = base64.replace(/\//g, "_");
-  return base64;
+  base64 = base64.replace(/\+/g, `-`)
+  base64 = base64.replace(/\//g, `_`)
+  return base64
 }
diff --git a/src/assets/scripts/util.js b/src/assets/scripts/util.js
index 6f8f189..546bdbc 100644
--- a/src/assets/scripts/util.js
+++ b/src/assets/scripts/util.js
@@ -1,102 +1,105 @@
-import defaultTheme from "./themes/default-theme";
-import prettier from "prettier/standalone";
-import prettierMarkdown from "prettier/parser-markdown";
-import prettierCss from "prettier/parser-postcss";
+import defaultTheme from './themes/default-theme'
+import prettier from 'prettier/standalone'
+import prettierMarkdown from 'prettier/parser-markdown'
+import prettierCss from 'prettier/parser-postcss'
 
 // 设置自定义颜色
 export function setColorWithTemplate(template) {
   return function (color) {
-    let customTheme = JSON.parse(JSON.stringify(template));
-    customTheme.block.h1["border-bottom"] = `2px solid ${color}`;
-    customTheme.block.h2["background"] = color;
-    customTheme.block.h3["border-left"] = `3px solid ${color}`;
-    customTheme.block.h4["color"] = color;
-    customTheme.inline.strong["color"] = color;
-    return customTheme;
-  };
+    let customTheme = JSON.parse(JSON.stringify(template))
+    customTheme.block.h1[`border-bottom`] = `2px solid ${color}`
+    customTheme.block.h2[`background`] = color
+    customTheme.block.h3[`border-left`] = `3px solid ${color}`
+    customTheme.block.h4[`color`] = color
+    customTheme.inline.strong[`color`] = color
+    return customTheme
+  }
 }
 
 export const setColorWithCustomTemplate = function setColorWithCustomTemplate(
   template,
   color
 ) {
-  let customTheme = JSON.parse(JSON.stringify(template));
-  customTheme.block.h1["border-bottom"] = `2px solid ${color}`;
-  customTheme.block.h2["background"] = color;
-  customTheme.block.h3["border-left"] = `3px solid ${color}`;
-  customTheme.block.h4["color"] = color;
-  customTheme.inline.strong["color"] = color;
-  return customTheme;
-};
+  let customTheme = JSON.parse(JSON.stringify(template))
+  customTheme.block.h1[`border-bottom`] = `2px solid ${color}`
+  customTheme.block.h2[`background`] = color
+  customTheme.block.h3[`border-left`] = `3px solid ${color}`
+  customTheme.block.h4[`color`] = color
+  customTheme.inline.strong[`color`] = color
+  return customTheme
+}
 
 // 设置自定义字体大小
 export function setFontSizeWithTemplate(template) {
   return function (fontSize) {
-    let customTheme = JSON.parse(JSON.stringify(template));
-    customTheme.block.h1["font-size"] = `${fontSize * 1.14}px`;
-    customTheme.block.h2["font-size"] = `${fontSize * 1.1}px`;
-    customTheme.block.h3["font-size"] = `${fontSize}px`;
-    customTheme.block.h4["font-size"] = `${fontSize}px`;
-    return customTheme;
-  };
+    let customTheme = JSON.parse(JSON.stringify(template))
+    customTheme.block.h1[`font-size`] = `${fontSize * 1.14}px`
+    customTheme.block.h2[`font-size`] = `${fontSize * 1.1}px`
+    customTheme.block.h3[`font-size`] = `${fontSize}px`
+    customTheme.block.h4[`font-size`] = `${fontSize}px`
+    return customTheme
+  }
 }
 
-export const setColor = setColorWithTemplate(defaultTheme);
-export const setFontSize = setFontSizeWithTemplate(defaultTheme);
+export const setColor = setColorWithTemplate(defaultTheme)
+export const setFontSize = setFontSizeWithTemplate(defaultTheme)
 
 export function customCssWithTemplate(jsonString, color, theme) {
-  let customTheme = JSON.parse(JSON.stringify(theme));
+  let customTheme = JSON.parse(JSON.stringify(theme))
   // block
-  customTheme.block.h1["border-bottom"] = `2px solid ${color}`;
-  customTheme.block.h2["background"] = color;
-  customTheme.block.h3["border-left"] = `3px solid ${color}`;
-  customTheme.block.h4["color"] = color;
-  customTheme.inline.strong["color"] = color;
+  customTheme.block.h1[`border-bottom`] = `2px solid ${color}`
+  customTheme.block.h2[`background`] = color
+  customTheme.block.h3[`border-left`] = `3px solid ${color}`
+  customTheme.block.h4[`color`] = color
+  customTheme.inline.strong[`color`] = color
 
-  customTheme.block.h1 = Object.assign(customTheme.block.h1, jsonString.h1);
-  customTheme.block.h2 = Object.assign(customTheme.block.h2, jsonString.h2);
-  customTheme.block.h3 = Object.assign(customTheme.block.h3, jsonString.h3);
-  customTheme.block.h4 = Object.assign(customTheme.block.h4, jsonString.h4);
-  customTheme.block.code = Object.assign(customTheme.block.code, jsonString.code);
-  customTheme.block.p = Object.assign(customTheme.block.p, jsonString.p);
-  customTheme.block.hr = Object.assign(customTheme.block.hr, jsonString.hr);
+  customTheme.block.h1 = Object.assign(customTheme.block.h1, jsonString.h1)
+  customTheme.block.h2 = Object.assign(customTheme.block.h2, jsonString.h2)
+  customTheme.block.h3 = Object.assign(customTheme.block.h3, jsonString.h3)
+  customTheme.block.h4 = Object.assign(customTheme.block.h4, jsonString.h4)
+  customTheme.block.code = Object.assign(
+    customTheme.block.code,
+    jsonString.code
+  )
+  customTheme.block.p = Object.assign(customTheme.block.p, jsonString.p)
+  customTheme.block.hr = Object.assign(customTheme.block.hr, jsonString.hr)
   customTheme.block.blockquote = Object.assign(
     customTheme.block.blockquote,
     jsonString.blockquote
-  );
+  )
   customTheme.block.blockquote_p = Object.assign(
     customTheme.block.blockquote_p,
     jsonString.blockquote_p
-  );
+  )
   customTheme.block.image = Object.assign(
     customTheme.block.image,
     jsonString.image
-  );
+  )
 
   // inline
   customTheme.inline.strong = Object.assign(
     customTheme.inline.strong,
     jsonString.strong
-  );
+  )
   customTheme.inline.codespan = Object.assign(
     customTheme.inline.codespan,
     jsonString.codespan
-  );
+  )
   customTheme.inline.link = Object.assign(
     customTheme.inline.link,
     jsonString.link
-  );
+  )
   customTheme.inline.wx_link = Object.assign(
     customTheme.inline.wx_link,
     jsonString.wx_link
-  );
-  customTheme.block.ul = Object.assign(customTheme.block.ul, jsonString.ul);
-  customTheme.block.ol = Object.assign(customTheme.block.ol, jsonString.ol);
+  )
+  customTheme.block.ul = Object.assign(customTheme.block.ul, jsonString.ul)
+  customTheme.block.ol = Object.assign(customTheme.block.ol, jsonString.ol)
   customTheme.inline.listitem = Object.assign(
     customTheme.inline.listitem,
     jsonString.li
-  );
-  return customTheme;
+  )
+  return customTheme
 }
 
 /**
@@ -106,21 +109,21 @@ export function customCssWithTemplate(jsonString, color, theme) {
  */
 export function css2json(css) {
   // 移除CSS所有注释
-  let open, close;
+  let open, close
   while (
-    (open = css.indexOf("/*")) !== -1 &&
-    (close = css.indexOf("*/")) !== -1
+    (open = css.indexOf(`/*`)) !== -1 &&
+    (close = css.indexOf(`*/`)) !== -1
   ) {
-    css = css.substring(0, open) + css.substring(close + 2);
+    css = css.substring(0, open) + css.substring(close + 2)
   }
 
   // 初始化返回值
-  let json = {};
+  let json = {}
 
-  while (css.length > 0 && css.indexOf("{") !== -1 && css.indexOf("}") !== -1) {
+  while (css.length > 0 && css.indexOf(`{`) !== -1 && css.indexOf(`}`) !== -1) {
     // 存储第一个左/右花括号的下标
-    const lbracket = css.indexOf("{");
-    const rbracket = css.indexOf("}");
+    const lbracket = css.indexOf(`{`)
+    const rbracket = css.indexOf(`}`)
 
     // 第一步：将声明转换为Object，如：
     // `font: 'Times New Roman' 1em; color: #ff0000; margin-top: 1em;`
@@ -128,26 +131,27 @@ export function css2json(css) {
     // `{"font": "'Times New Roman' 1em", "color": "#ff0000", "margin-top": "1em"}`
 
     // 辅助方法：将array转为object
+    // eslint-disable-next-line no-inner-declarations
     function toObject(array) {
-      let ret = {};
+      let ret = {}
       array.forEach((e) => {
-        const index = e.indexOf(":");
-        const property = e.substring(0, index).trim();
-        const value = e.substring(index + 1).trim();
-        ret[property] = value;
-      });
-      return ret;
+        const index = e.indexOf(`:`)
+        const property = e.substring(0, index).trim()
+        const value = e.substring(index + 1).trim()
+        ret[property] = value
+      })
+      return ret
     }
 
     // 切割声明块并移除空白符，然后放入数组中
     let declarations = css
       .substring(lbracket + 1, rbracket)
-      .split(";")
+      .split(`;`)
       .map((e) => e.trim())
-      .filter((e) => e.length > 0); // 移除所有""空值
+      .filter((e) => e.length > 0) // 移除所有""空值
 
     // 转为Object对象
-    declarations = toObject(declarations);
+    declarations = toObject(declarations)
 
     // 第二步：选择器处理，每个选择器会与它对应的声明相关联，如：
     // `h1, p#bar {color: red}`
@@ -157,25 +161,25 @@ export function css2json(css) {
     let selectors = css
       .substring(0, lbracket)
       // 以,切割，并移除空格：`"h1, p#bar, span.foo"` => ["h1", "p#bar", "span.foo"]
-      .split(",")
-      .map((selector) => selector.trim());
+      .split(`,`)
+      .map((selector) => selector.trim())
 
     // 迭代赋值
     selectors.forEach((selector) => {
       // 若不存在，则先初始化
-      if (!json[selector]) json[selector] = {};
+      if (!json[selector]) json[selector] = {}
       // 赋值到JSON
       Object.keys(declarations).forEach((key) => {
-        json[selector][key] = declarations[key];
-      });
-    });
+        json[selector][key] = declarations[key]
+      })
+    })
 
     // 继续下个声明块
-    css = css.slice(rbracket + 1).trim();
+    css = css.slice(rbracket + 1).trim()
   }
 
   // 返回JSON形式的结果串
-  return json;
+  return json
 }
 
 /**
@@ -184,11 +188,11 @@ export function css2json(css) {
  * @param {*} name
  */
 export function saveEditorContent(editor, name) {
-  const content = editor.getValue(0);
+  const content = editor.getValue(0)
   if (content) {
-    localStorage.setItem(name, content);
+    localStorage.setItem(name, content)
   } else {
-    localStorage.removeItem(name);
+    localStorage.removeItem(name)
   }
 }
 
@@ -198,10 +202,10 @@ export function saveEditorContent(editor, name) {
  */
 export function formatDoc(content) {
   const doc = prettier.format(content, {
-    parser: "markdown",
+    parser: `markdown`,
     plugins: [prettierMarkdown],
-  });
-  return doc;
+  })
+  return doc
 }
 
 /**
@@ -210,10 +214,10 @@ export function formatDoc(content) {
  */
 export function formatCss(content) {
   const doc = prettier.format(content, {
-    parser: "css",
+    parser: `css`,
     plugins: [prettierCss],
-  });
-  return doc;
+  })
+  return doc
 }
 
 /**
@@ -221,72 +225,73 @@ export function formatCss(content) {
  * @param {文档内容} doc
  */
 export function downloadMD(doc) {
-  let downLink = document.createElement("a");
+  let downLink = document.createElement(`a`)
 
-  downLink.download = "content.md";
-  downLink.style.display = "none";
-  let blob = new Blob([doc]);
+  downLink.download = `content.md`
+  downLink.style.display = `none`
+  let blob = new Blob([doc])
 
-  downLink.href = URL.createObjectURL(blob);
-  document.body.appendChild(downLink);
-  downLink.click();
-  document.body.removeChild(downLink);
+  downLink.href = URL.createObjectURL(blob)
+  document.body.appendChild(downLink)
+  downLink.click()
+  document.body.removeChild(downLink)
 }
 
 /**
  * 导出 HTML 生成内容
  */
 export function exportHTML() {
-  const element = document.querySelector("#output");
-  setStyles(element);
-  const htmlStr = element.innerHTML;
+  const element = document.querySelector(`#output`)
+  setStyles(element)
+  const htmlStr = element.innerHTML
 
-  const downLink = document.createElement("a");
+  const downLink = document.createElement(`a`)
 
-  downLink.download = "content.html";
-  downLink.style.display = "none";
+  downLink.download = `content.html`
+  downLink.style.display = `none`
   let blob = new Blob([
     `<html><head><meta charset="utf-8" /></head><body><div style="width: 750px; margin: auto;">${htmlStr}</div></body></html>`,
-  ]);
+  ])
 
-  downLink.href = URL.createObjectURL(blob);
-  document.body.appendChild(downLink);
-  downLink.click();
-  document.body.removeChild(downLink);
+  downLink.href = URL.createObjectURL(blob)
+  document.body.appendChild(downLink)
+  downLink.click()
+  document.body.removeChild(downLink)
 
   function setStyles(element) {
     switch (true) {
       case isPre(element):
       case isCode(element):
       case isSpan(element):
-        element.setAttribute("style", getElementStyles(element));
+        element.setAttribute(`style`, getElementStyles(element))
+      // eslint-disable-next-line no-fallthrough
       default:
     }
     if (element.children.length) {
-      Array.from(element.children).forEach((child) => setStyles(child));
+      Array.from(element.children).forEach((child) => setStyles(child))
     }
 
     // 判断是否是包裹代码块的 pre 元素
     function isPre(element) {
       return (
-        element.tagName === "PRE" &&
-        Array.from(element.classList).includes("code__pre")
-      );
+        element.tagName === `PRE` &&
+        Array.from(element.classList).includes(`code__pre`)
+      )
     }
     // 判断是否是包裹代码块的 code 元素
     function isCode(element) {
       return (
-        element.tagName === "CODE" &&
-        Array.from(element.classList).includes("prettyprint")
-      );
+        element.tagName === `CODE` &&
+        Array.from(element.classList).includes(`prettyprint`)
+      )
     }
     // 判断是否是包裹代码字符的 span 元素
     function isSpan(element) {
       return (
-        element.tagName === "SPAN" &&
+        element.tagName === `SPAN` &&
         (isCode(element.parentElement) ||
           isCode(element.parentElement.parentElement))
-      );
+      )
     }
   }
 }
@@ -298,52 +303,52 @@ export function exportHTML() {
  * @param {*} cols 列
  */
 export function createTable({ data, rows, cols }) {
-  let table = "";
-  let currRow = [];
+  let table = ``
+  let currRow = []
   for (let i = 0; i < rows + 2; ++i) {
-    table += "|\t";
-    currRow = [];
+    table += `|\t`
+    currRow = []
     for (let j = 0; j < cols; ++j) {
-      const rowIdx = i > 1 ? i - 1 : i;
+      const rowIdx = i > 1 ? i - 1 : i
       i === 1
-        ? currRow.push("---\t")
-        : currRow.push(data[`k_${rowIdx}_${j}`] || "");
+        ? currRow.push(`---\t`)
+        : currRow.push(data[`k_${rowIdx}_${j}`] || ``)
     }
-    table += currRow.join("\t|\t");
-    table += "\t|\n";
+    table += currRow.join(`\t|\t`)
+    table += `\t|\n`
   }
 
-  return table;
+  return table
 }
 
 export const toBase64 = (file) =>
   new Promise((resolve, reject) => {
-    const reader = new FileReader();
-    reader.readAsDataURL(file);
-    reader.onload = () => resolve(reader.result.split(",").pop());
-    reader.onerror = (error) => reject(error);
-  });
+    const reader = new FileReader()
+    reader.readAsDataURL(file)
+    reader.onload = () => resolve(reader.result.split(`,`).pop())
+    reader.onerror = (error) => reject(error)
+  })
 
 export function checkImage(file) {
   // check filename suffix
-  const isValidSuffix = /\.(gif|jpg|jpeg|png|GIF|JPG|PNG)$/.test(file.name);
+  const isValidSuffix = /\.(gif|jpg|jpeg|png|GIF|JPG|PNG)$/.test(file.name)
   if (!isValidSuffix) {
     return {
       ok: false,
-      msg: "请上传 JPG/PNG/GIF 格式的图片",
-    };
+      msg: `请上传 JPG/PNG/GIF 格式的图片`,
+    }
   }
 
   // check file size
-  const maxSize = 10;
-  const valid = file.size / 1024 / 1024 <= maxSize;
+  const maxSize = 10
+  const valid = file.size / 1024 / 1024 <= maxSize
   if (!valid) {
     return {
       ok: false,
       msg: `由于公众号限制，图片大小不能超过 ${maxSize}M`,
-    };
+    }
   }
-  return { ok: true };
+  return { ok: true }
 }
 
 /**
@@ -352,12 +357,12 @@ export function checkImage(file) {
  * @param {排除的属性} excludes 如果某些属性对结果有不良影响，可以使用这个参数来排除
  * @returns 行内样式拼接结果
  */
-function getElementStyles(element, excludes = ["width", "height"]) {
-  const styles = getComputedStyle(element, null);
+function getElementStyles(element, excludes = [`width`, `height`]) {
+  const styles = getComputedStyle(element, null)
   return Object.entries(styles)
     .filter(([key]) => styles.getPropertyValue(key) && !excludes.includes(key))
     .map(([key, value]) => `${key}:${value};`)
-    .join("");
+    .join(``)
 }
 
 /**
@@ -366,14 +371,13 @@ function getElementStyles(element, excludes = ["width", "height"]) {
  * @returns
  */
 export function removeLeft(str) {
-  const lines = str.split('\n')
+  const lines = str.split(`\n`)
   // 获取应该删除的空白符数量
-  const minSpaceNum = lines.filter(item => item.trim())
-    .map(item => item.match(/(^\s+)?/)[0].length)
+  const minSpaceNum = lines
+    .filter((item) => item.trim())
+    .map((item) => item.match(/(^\s+)?/)[0].length)
     .sort((a, b) => a - b)[0]
   // 删除空白符
-  const newStr = lines
-    .map(item => item.slice(minSpaceNum))
-    .join('\n')
+  const newStr = lines.map((item) => item.slice(minSpaceNum)).join(`\n`)
   return newStr
 }
diff --git a/src/components/CodemirrorEditor/aboutDialog.vue b/src/components/CodemirrorEditor/aboutDialog.vue
index a9c2b9c..c0e56b4 100644
--- a/src/components/CodemirrorEditor/aboutDialog.vue
+++ b/src/components/CodemirrorEditor/aboutDialog.vue
@@ -44,10 +44,10 @@ export default {
   },
   methods: {
     onRedirect(url) {
-      window.open(url);
+      window.open(url)
     },
   },
-};
+}
 </script>
 
 <style lang="less" scoped>
diff --git a/src/components/CodemirrorEditor/header.vue b/src/components/CodemirrorEditor/header.vue
index d2c63bd..45392d7 100644
--- a/src/components/CodemirrorEditor/header.vue
+++ b/src/components/CodemirrorEditor/header.vue
@@ -1,22 +1,32 @@
 <template>
   <el-container class="top is-dark">
-    <el-dialog
-      title="发布"
-      :visible.sync="form.dialogVisible"
-      >
+    <el-dialog title="发布" :visible.sync="form.dialogVisible">
       <div class="postInfo">
         <el-form ref="form" :model="form" label-width="80px">
           <el-form-item label="封面">
-            <el-input v-model="form.thumb" placeholder="自动提取第一张图"></el-input>
+            <el-input
+              v-model="form.thumb"
+              placeholder="自动提取第一张图"
+            ></el-input>
           </el-form-item>
           <el-form-item label="标题">
-            <el-input v-model="form.title" placeholder="自动提取第一个标题"></el-input>
+            <el-input
+              v-model="form.title"
+              placeholder="自动提取第一个标题"
+            ></el-input>
           </el-form-item>
           <el-form-item label="描述">
-            <el-input type="textarea" :rows="4" v-model="form.desc" placeholder="自动提取第一个段落"></el-input>
+            <el-input
+              type="textarea"
+              :rows="4"
+              v-model="form.desc"
+              placeholder="自动提取第一个段落"
+            ></el-input>
           </el-form-item>
           <el-form-item>
-            <div class="info">注：此功能由第三方浏览器插件支持，本平台不保证安全性。</div>
+            <div class="info">
+              注：此功能由第三方浏览器插件支持，本平台不保证安全性。
+            </div>
           </el-form-item>
         </el-form>
       </div>
@@ -238,14 +248,14 @@ import {
   setFontSize,
   fixCodeWhiteSpace,
   setColorWithCustomTemplate,
-} from "../../assets/scripts/util";
-import { solveWeChatImage, solveHtml } from "../../assets/scripts/converter";
-import config from "../../assets/scripts/config";
-import DEFAULT_CSS_CONTENT from "@/assets/example/theme-css.txt";
-import resetDialog from "./resetDialog";
-import { mapState, mapMutations } from "vuex";
+} from '../../assets/scripts/util'
+import { solveWeChatImage, solveHtml } from '../../assets/scripts/converter'
+import config from '../../assets/scripts/config'
+import DEFAULT_CSS_CONTENT from '@/assets/example/theme-css.txt'
+import resetDialog from './resetDialog'
+import { mapState, mapMutations } from 'vuex'
 export default {
-  name: "editor-header",
+  name: `editor-header`,
   data() {
     return {
       form: {
@@ -258,24 +268,24 @@ export default {
       config: config,
       citeStatus: false,
       showResetConfirm: false,
-      selectFont: "",
-      selectSize: "",
-      selectColor: "",
-      selectCodeTheme: config.codeThemeOption[0].value
-    };
+      selectFont: ``,
+      selectSize: ``,
+      selectColor: ``,
+      selectCodeTheme: config.codeThemeOption[0].value,
+    }
   },
   components: {
     resetDialog,
   },
   computed: {
     effect() {
-      return this.nightMode ? "dark" : "light";
+      return this.nightMode ? `dark` : `light`
     },
     btnContent() {
-      return this.nightMode ? "浅色模式" : "暗黑模式";
+      return this.nightMode ? `浅色模式` : `暗黑模式`
     },
     btnType() {
-      return this.nightMode ? "default" : "primary";
+      return this.nightMode ? `default` : `primary`
     },
     ...mapState({
       output: (state) => state.output,
@@ -295,7 +305,9 @@ export default {
       try {
         auto = {
           thumb: document.querySelector(`#output img`).src,
-          title: [1,2,3,4,5,6].map(h => document.querySelector(`#output h${h}`)).filter(h => h)[0].innerText,
+          title: [1, 2, 3, 4, 5, 6]
+            .map((h) => document.querySelector(`#output h${h}`))
+            .filter((h) => h)[0].innerText,
           desc: document.querySelector(`#output p`).innerText,
           content: this.output,
         }
@@ -321,124 +333,124 @@ export default {
     fontChanged(fonts) {
       this.setWxRendererOptions({
         fonts: fonts,
-      });
-      this.setCurrentFont(fonts);
-      this.$emit("refresh");
+      })
+      this.setCurrentFont(fonts)
+      this.$emit(`refresh`)
     },
     sizeChanged(size) {
-      let theme = setFontSize(size.replace("px", ""));
-      theme = setColorWithCustomTemplate(theme, this.currentColor);
+      let theme = setFontSize(size.replace(`px`, ``))
+      theme = setColorWithCustomTemplate(theme, this.currentColor)
       this.setWxRendererOptions({
         size: size,
         theme: theme,
-      });
-      this.setCurrentSize(size);
-      this.$emit("refresh");
+      })
+      this.setCurrentSize(size)
+      this.$emit(`refresh`)
     },
     colorChanged(color) {
-      let theme = setFontSize(this.currentSize.replace("px", ""));
+      let theme = setFontSize(this.currentSize.replace(`px`, ``))
 
-      theme = setColorWithCustomTemplate(theme, color);
+      theme = setColorWithCustomTemplate(theme, color)
       this.setWxRendererOptions({
         theme: theme,
-      });
-      this.setCurrentColor(color);
-      this.$emit("refresh");
+      })
+      this.setCurrentColor(color)
+      this.$emit(`refresh`)
     },
     codeThemeChanged(theme) {
-      this.setCurrentCodeTheme(theme);
-      this.$emit("refresh");
+      this.setCurrentCodeTheme(theme)
+      this.$emit(`refresh`)
     },
     statusChanged(val) {
-      this.setCiteStatus(val);
-      this.$emit("refresh");
+      this.setCiteStatus(val)
+      this.$emit(`refresh`)
     },
     // 复制到微信公众号
     copy(e) {
-      this.$emit("startCopy");
+      this.$emit(`startCopy`)
       setTimeout(() => {
-        let clipboardDiv = document.getElementById("output");
-        solveWeChatImage();
-        solveHtml();
-        clipboardDiv.focus();
-        window.getSelection().removeAllRanges();
-        let range = document.createRange();
+        let clipboardDiv = document.getElementById(`output`)
+        solveWeChatImage()
+        solveHtml()
+        clipboardDiv.focus()
+        window.getSelection().removeAllRanges()
+        let range = document.createRange()
 
-        range.setStartBefore(clipboardDiv.firstChild);
-        range.setEndAfter(clipboardDiv.lastChild);
-        window.getSelection().addRange(range);
-        document.execCommand("copy");
-        window.getSelection().removeAllRanges();
-        clipboardDiv.innerHTML = this.output;
+        range.setStartBefore(clipboardDiv.firstChild)
+        range.setEndAfter(clipboardDiv.lastChild)
+        window.getSelection().addRange(range)
+        document.execCommand(`copy`)
+        window.getSelection().removeAllRanges()
+        clipboardDiv.innerHTML = this.output
         // 输出提示
         this.$notify({
           showClose: true,
-          message: "已复制渲染后的文章到剪贴板，可直接到公众号后台粘贴",
+          message: `已复制渲染后的文章到剪贴板，可直接到公众号后台粘贴`,
           offset: 80,
           duration: 1600,
-          type: "success",
-        });
-        this.$emit("refresh");
-        this.$emit("endCopy");
-      }, 350);
+          type: `success`,
+        })
+        this.$emit(`refresh`)
+        this.$emit(`endCopy`)
+      }, 350)
     },
     // 自定义CSS样式
     async customStyle() {
-      this.$emit("showCssEditor");
+      this.$emit(`showCssEditor`)
       this.$nextTick(() => {
         if (!this.cssEditor) {
-          this.cssEditor.refresh();
+          this.cssEditor.refresh()
         }
-      });
+      })
       setTimeout(() => {
-        this.cssEditor.refresh();
-      }, 50);
+        this.cssEditor.refresh()
+      }, 50)
 
-      let flag = await localStorage.getItem("__css_content");
+      let flag = await localStorage.getItem(`__css_content`)
       if (!flag) {
-        this.setCssEditorValue(DEFAULT_CSS_CONTENT);
+        this.setCssEditorValue(DEFAULT_CSS_CONTENT)
       }
     },
     // 重置样式
     confirmReset() {
-      localStorage.clear();
-      this.cssEditor.setValue(DEFAULT_CSS_CONTENT);
-      this.citeStatus = false;
-      this.statusChanged(false);
-      this.fontChanged(this.config.builtinFonts[0].value);
-      this.colorChanged(this.config.colorOption[0].value);
-      this.sizeChanged(this.config.sizeOption[2].value);
+      localStorage.clear()
+      this.cssEditor.setValue(DEFAULT_CSS_CONTENT)
+      this.citeStatus = false
+      this.statusChanged(false)
+      this.fontChanged(this.config.builtinFonts[0].value)
+      this.colorChanged(this.config.colorOption[0].value)
+      this.sizeChanged(this.config.sizeOption[2].value)
       this.codeThemeChanged(this.config.codeThemeOption[0].value)
-      this.$emit("cssChanged");
-      this.selectFont = this.currentFont;
-      this.selectSize = this.currentSize;
-      this.selectColor = this.currentColor;
-      this.showResetConfirm = false;
-      this.selectCodeTheme = this.codeTheme;
+      this.$emit(`cssChanged`)
+      this.selectFont = this.currentFont
+      this.selectSize = this.currentSize
+      this.selectColor = this.currentColor
+      this.showResetConfirm = false
+      this.selectCodeTheme = this.codeTheme
     },
     cancelReset() {
-      this.showResetConfirm = false;
-      this.editor.focus();
+      this.showResetConfirm = false
+      this.editor.focus()
     },
     ...mapMutations([
-      "setCurrentColor",
-      "setCiteStatus",
-      "themeChanged",
-      "setCurrentFont",
-      "setCurrentSize",
-      "setCssEditorValue",
-      "setCurrentCodeTheme",
-      "setWxRendererOptions",
+      `setCurrentColor`,
+      `setCiteStatus`,
+      `themeChanged`,
+      `setCurrentFont`,
+      `setCurrentSize`,
+      `setCssEditorValue`,
+      `setCurrentCodeTheme`,
+      `setWxRendererOptions`,
     ]),
   },
   mounted() {
-    this.selectFont = this.currentFont;
-    this.selectSize = this.currentSize;
-    this.selectColor = this.currentColor;
-    this.selectCodeTheme = this.codeTheme;
-    this.citeStatus = this.currentCiteStatus;
+    this.selectFont = this.currentFont
+    this.selectSize = this.currentSize
+    this.selectColor = this.currentColor
+    this.selectCodeTheme = this.codeTheme
+    this.citeStatus = this.currentCiteStatus
   },
-};
+}
 </script>
 
 <style lang="less" scoped>
@@ -459,12 +471,12 @@ export default {
   margin-right: 24px;
   width: 24px;
   height: 24px;
-  background: url("../../assets/images/night.png") no-repeat;
+  background: url('../../assets/images/night.png') no-repeat;
   background-size: cover;
   transition: all 0.3s;
 }
 .mode__switch_black {
-  background: url("../../assets/images/light.png") no-repeat;
+  background: url('../../assets/images/light.png') no-repeat;
   background-size: cover;
 }
 .top {
diff --git a/src/components/CodemirrorEditor/insertForm.vue b/src/components/CodemirrorEditor/insertForm.vue
index f3b377b..85db79b 100644
--- a/src/components/CodemirrorEditor/insertForm.vue
+++ b/src/components/CodemirrorEditor/insertForm.vue
@@ -53,9 +53,9 @@
 </template>
 
 <script>
-import config from "../../assets/scripts/config";
-import { createTable } from "../../assets/scripts/util";
-import { mapState, mapMutations } from "vuex";
+import config from '../../assets/scripts/config'
+import { createTable } from '../../assets/scripts/util'
+import { mapState, mapMutations } from 'vuex'
 export default {
   props: {
     value: {
@@ -69,11 +69,11 @@ export default {
       rowNum: 3,
       colNum: 3,
       tableData: {},
-    };
+    }
   },
   computed: {
     btnType() {
-      return this.nightMode ? "default" : "primary";
+      return this.nightMode ? `default` : `primary`
     },
     ...mapState({
       nightMode: (state) => state.nightMode,
@@ -83,23 +83,23 @@ export default {
   methods: {
     // 插入表格
     insertTable() {
-      const cursor = this.editor.getCursor();
+      const cursor = this.editor.getCursor()
       const table = createTable({
         data: this.tableData,
         rows: this.rowNum,
         cols: this.colNum,
-      });
+      })
 
-      this.tableData = {};
-      this.rowNum = 3;
-      this.colNum = 3;
-      this.editor.replaceSelection(`\n${table}\n`, "end");
-      this.$emit("input", false);
-      this.editorRefresh();
+      this.tableData = {}
+      this.rowNum = 3
+      this.colNum = 3
+      this.editor.replaceSelection(`\n${table}\n`, `end`)
+      this.$emit(`input`, false)
+      this.editorRefresh()
     },
-    ...mapMutations(["editorRefresh"]),
+    ...mapMutations([`editorRefresh`]),
   },
-};
+}
 </script>
 
 <style lang="less" scoped>
diff --git a/src/components/CodemirrorEditor/resetDialog.vue b/src/components/CodemirrorEditor/resetDialog.vue
index e108fa5..7f47968 100644
--- a/src/components/CodemirrorEditor/resetDialog.vue
+++ b/src/components/CodemirrorEditor/resetDialog.vue
@@ -16,7 +16,7 @@
 </template>
 
 <script>
-import { mapState } from "vuex";
+import { mapState } from 'vuex'
 export default {
   props: {
     showResetConfirm: {
@@ -26,13 +26,13 @@ export default {
   },
   computed: {
     btnType() {
-      return this.nightMode ? "default" : "primary";
+      return this.nightMode ? `default` : `primary`
     },
     ...mapState({
       nightMode: (state) => state.nightMode,
     }),
   },
-};
+}
 </script>
 
 <style lang="less" scoped>
diff --git a/src/components/CodemirrorEditor/rightClickMenu.vue b/src/components/CodemirrorEditor/rightClickMenu.vue
index d859dc8..7ef4b67 100644
--- a/src/components/CodemirrorEditor/rightClickMenu.vue
+++ b/src/components/CodemirrorEditor/rightClickMenu.vue
@@ -39,49 +39,49 @@ export default {
       menu: [
         [
           {
-            text: "上传图片",
-            key: "insertPic",
+            text: `上传图片`,
+            key: `insertPic`,
           },
           {
-            text: "插入表格",
-            key: "insertTable",
+            text: `插入表格`,
+            key: `insertTable`,
           },
           {
-            text: "恢复默认样式",
-            key: "resetStyle",
+            text: `恢复默认样式`,
+            key: `resetStyle`,
           },
         ],
         [
           {
-            text: '导入 Markdown 文档',
-            key: 'importMarkdown',
+            text: `导入 Markdown 文档`,
+            key: `importMarkdown`,
           },
           {
-            text: "导出 Markdown 文档",
-            key: "download",
+            text: `导出 Markdown 文档`,
+            key: `download`,
           },
           {
-            text: "导出 HTML 页面",
-            key: "export",
+            text: `导出 HTML 页面`,
+            key: `export`,
           },
           {
-            text: "格式化 Markdown 文档",
-            key: "formatMarkdown",
+            text: `格式化 Markdown 文档`,
+            key: `formatMarkdown`,
           },
         ],
       ],
-    };
+    }
   },
   methods: {
     closeCB() {
-      this.$emit("input", false);
+      this.$emit(`input`, false)
     },
     onMouseDown(key) {
-      this.$emit("menuTick", key);
-      this.$emit("closeMenu", false);
+      this.$emit(`menuTick`, key)
+      this.$emit(`closeMenu`, false)
     },
   },
-};
+}
 </script>
 
 <style lang="less" scoped>
diff --git a/src/components/CodemirrorEditor/uploadImgDialog.vue b/src/components/CodemirrorEditor/uploadImgDialog.vue
index 054910b..468e574 100644
--- a/src/components/CodemirrorEditor/uploadImgDialog.vue
+++ b/src/components/CodemirrorEditor/uploadImgDialog.vue
@@ -386,8 +386,8 @@
 </template>
 
 <script>
-import { checkImage, removeLeft } from "../../assets/scripts/util";
-import CodeMirror from "codemirror/lib/codemirror";
+import { checkImage, removeLeft } from '../../assets/scripts/util'
+import CodeMirror from 'codemirror/lib/codemirror'
 
 export default {
   props: {
@@ -401,45 +401,45 @@ export default {
       activeName: `upload`,
 
       formGitHub: {
-        repo: "",
-        branch: "",
-        accessToken: "",
+        repo: ``,
+        branch: ``,
+        accessToken: ``,
       },
       formGitee: {
-        repo: "",
-        branch: "",
-        accessToken: "",
+        repo: ``,
+        branch: ``,
+        accessToken: ``,
       },
       formAliOSS: {
-        accessKeyId: "",
-        accessKeySecret: "",
-        bucket: "",
-        region: "",
-        path: "",
-        cdnHost: "",
+        accessKeyId: ``,
+        accessKeySecret: ``,
+        bucket: ``,
+        region: ``,
+        path: ``,
+        cdnHost: ``,
       },
       minioOSS: {
-        endpoint: "",
-        port: "",
+        endpoint: ``,
+        port: ``,
         useSSL: true,
-        bucket: "",
-        accessKey: "",
-        secretKey: "",
+        bucket: ``,
+        accessKey: ``,
+        secretKey: ``,
       },
       formTxCOS: {
-        secretId: "",
-        secretKey: "",
-        bucket: "",
-        region: "",
-        path: "",
-        cdnHost: "",
+        secretId: ``,
+        secretKey: ``,
+        bucket: ``,
+        region: ``,
+        path: ``,
+        cdnHost: ``,
       },
       formQiniu: {
-        accessKey: "",
-        secretKey: "",
-        bucket: "",
-        domain: "",
-        region: "",
+        accessKey: ``,
+        secretKey: ``,
+        bucket: ``,
+        domain: ``,
+        region: ``,
       },
       formCustom: {
         code:
@@ -460,83 +460,83 @@ export default {
       },
       options: [
         {
-          value: "default",
-          label: "默认",
+          value: `default`,
+          label: `默认`,
         },
         {
-          value: "gitee",
-          label: "Gitee",
+          value: `gitee`,
+          label: `Gitee`,
         },
         {
-          value: "github",
-          label: "GitHub",
+          value: `github`,
+          label: `GitHub`,
         },
         {
-          value: "aliOSS",
-          label: "阿里云",
+          value: `aliOSS`,
+          label: `阿里云`,
         },
         {
-          value: "txCOS",
-          label: "腾讯云",
+          value: `txCOS`,
+          label: `腾讯云`,
         },
         {
-          value: "qiniu",
-          label: "七牛云",
+          value: `qiniu`,
+          label: `七牛云`,
         },
         {
-          value: "minio",
-          label: "MinIO",
+          value: `minio`,
+          label: `MinIO`,
         },
         {
-          value: "formCustom",
-          label: "自定义代码",
+          value: `formCustom`,
+          label: `自定义代码`,
         },
       ],
-      imgHost: "default",
-    };
+      imgHost: `default`,
+    }
   },
   created() {
-    if (localStorage.getItem("githubConfig")) {
-      this.formGitHub = JSON.parse(localStorage.getItem("githubConfig"));
+    if (localStorage.getItem(`githubConfig`)) {
+      this.formGitHub = JSON.parse(localStorage.getItem(`githubConfig`))
     }
-    if (localStorage.getItem("giteeConfig")) {
-      this.formGitee = JSON.parse(localStorage.getItem("giteeConfig"));
+    if (localStorage.getItem(`giteeConfig`)) {
+      this.formGitee = JSON.parse(localStorage.getItem(`giteeConfig`))
     }
-    if (localStorage.getItem("aliOSSConfig")) {
-      this.formAliOSS = JSON.parse(localStorage.getItem("aliOSSConfig"));
+    if (localStorage.getItem(`aliOSSConfig`)) {
+      this.formAliOSS = JSON.parse(localStorage.getItem(`aliOSSConfig`))
     }
-    if (localStorage.getItem("minioConfig")) {
-      this.minioOSS = JSON.parse(localStorage.getItem("minioConfig"));
+    if (localStorage.getItem(`minioConfig`)) {
+      this.minioOSS = JSON.parse(localStorage.getItem(`minioConfig`))
     }
-    if (localStorage.getItem("txCOSConfig")) {
-      this.formTxCOS = JSON.parse(localStorage.getItem("txCOSConfig"));
+    if (localStorage.getItem(`txCOSConfig`)) {
+      this.formTxCOS = JSON.parse(localStorage.getItem(`txCOSConfig`))
     }
-    if (localStorage.getItem("imgHost")) {
-      this.imgHost = localStorage.getItem("imgHost");
+    if (localStorage.getItem(`imgHost`)) {
+      this.imgHost = localStorage.getItem(`imgHost`)
     }
   },
   methods: {
     changeImgHost() {
-      localStorage.setItem("imgHost", this.imgHost);
-      this.$message.success("已成功切换图床");
+      localStorage.setItem(`imgHost`, this.imgHost)
+      this.$message.success(`已成功切换图床`)
     },
     saveGitHubConfiguration() {
       if (!(this.formGitHub.repo && this.formGitHub.accessToken)) {
-        const blankElement = this.formGitHub.repo ? "token" : "GitHub 仓库";
-        this.$message.error(`参数「​${blankElement}」不能为空`);
-        return;
+        const blankElement = this.formGitHub.repo ? `token` : `GitHub 仓库`
+        this.$message.error(`参数「${blankElement}」不能为空`)
+        return
       }
-      localStorage.setItem("githubConfig", JSON.stringify(this.formGitHub));
-      this.$message.success("保存成功");
+      localStorage.setItem(`githubConfig`, JSON.stringify(this.formGitHub))
+      this.$message.success(`保存成功`)
     },
     saveGiteeConfiguration() {
       if (!(this.formGitee.repo && this.formGitee.accessToken)) {
-        const blankElement = this.formGitee.repo ? "私人令牌" : "Gitee 仓库";
-        this.$message.error(`参数「​${blankElement}」不能为空`);
-        return;
+        const blankElement = this.formGitee.repo ? `私人令牌` : `Gitee 仓库`
+        this.$message.error(`参数「${blankElement}」不能为空`)
+        return
       }
-      localStorage.setItem("giteeConfig", JSON.stringify(this.formGitee));
-      this.$message.success("保存成功");
+      localStorage.setItem(`giteeConfig`, JSON.stringify(this.formGitee))
+      this.$message.success(`保存成功`)
     },
     saveAliOSSConfiguration() {
       if (
@@ -547,11 +547,11 @@ export default {
           this.formAliOSS.region
         )
       ) {
-        this.$message.error(`阿里云 OSS 参数配置不全`);
-        return;
+        this.$message.error(`阿里云 OSS 参数配置不全`)
+        return
       }
-      localStorage.setItem("aliOSSConfig", JSON.stringify(this.formAliOSS));
-      this.$message.success("保存成功");
+      localStorage.setItem(`aliOSSConfig`, JSON.stringify(this.formAliOSS))
+      this.$message.success(`保存成功`)
     },
     saveMinioOSSConfiguration() {
       if (
@@ -562,11 +562,11 @@ export default {
           this.minioOSS.secretKey
         )
       ) {
-        this.$message.error(`MinIO 参数配置不全`);
-        return;
+        this.$message.error(`MinIO 参数配置不全`)
+        return
       }
-      localStorage.setItem("minioConfig", JSON.stringify(this.minioOSS));
-      this.$message.success("保存成功");
+      localStorage.setItem(`minioConfig`, JSON.stringify(this.minioOSS))
+      this.$message.success(`保存成功`)
     },
     saveTxCOSConfiguration() {
       if (
@@ -577,11 +577,11 @@ export default {
           this.formTxCOS.region
         )
       ) {
-        this.$message.error(`腾讯云 COS 参数配置不全`);
-        return;
+        this.$message.error(`腾讯云 COS 参数配置不全`)
+        return
       }
-      localStorage.setItem("txCOSConfig", JSON.stringify(this.formTxCOS));
-      this.$message.success("保存成功");
+      localStorage.setItem(`txCOSConfig`, JSON.stringify(this.formTxCOS))
+      this.$message.success(`保存成功`)
     },
 
     saveQiniuConfiguration() {
@@ -594,40 +594,40 @@ export default {
           this.formQiniu.region
         )
       ) {
-        this.$message.error(`七牛云 Kodo 参数配置不全`);
-        return;
+        this.$message.error(`七牛云 Kodo 参数配置不全`)
+        return
       }
-      localStorage.setItem("qiniuConfig", JSON.stringify(this.formQiniu));
-      this.$message.success("保存成功");
+      localStorage.setItem(`qiniuConfig`, JSON.stringify(this.formQiniu))
+      this.$message.success(`保存成功`)
     },
     formCustomSave() {
-      const str = this.formCustom.editor.getValue();
-      localStorage.setItem(`formCustomConfig`, str);
-      this.$message.success(`保存成功`);
+      const str = this.formCustom.editor.getValue()
+      localStorage.setItem(`formCustomConfig`, str)
+      this.$message.success(`保存成功`)
     },
 
     beforeImageUpload(file) {
       // check image
-      const checkResult = checkImage(file);
+      const checkResult = checkImage(file)
       if (!checkResult.ok) {
-        this.$message.error(checkResult.msg);
-        return false;
+        this.$message.error(checkResult.msg)
+        return false
       }
       // check image host
-      let imgHost = localStorage.getItem("imgHost");
-      imgHost = imgHost ? imgHost : "default";
-      localStorage.setItem("imgHost", imgHost);
+      let imgHost = localStorage.getItem(`imgHost`)
+      imgHost = imgHost ? imgHost : `default`
+      localStorage.setItem(`imgHost`, imgHost)
 
-      const config = localStorage.getItem(`${imgHost}Config`);
-      const isValidHost = imgHost == "default" || config;
+      const config = localStorage.getItem(`${imgHost}Config`)
+      const isValidHost = imgHost == `default` || config
       if (!isValidHost) {
-        this.$message.error(`请先配置 ${imgHost} 图床参数`);
-        return false;
+        this.$message.error(`请先配置 ${imgHost} 图床参数`)
+        return false
       }
-      return true;
+      return true
     },
     uploadImage(params) {
-      this.$emit("uploadImage", params.file);
+      this.$emit(`uploadImage`, params.file)
     },
   },
   watch: {
@@ -637,20 +637,20 @@ export default {
         if (val === `formCustom`) {
           this.$nextTick(() => {
             const textarea =
-              this.$refs.formCustomElInput.$el.querySelector(`textarea`);
+              this.$refs.formCustomElInput.$el.querySelector(`textarea`)
             this.formCustom.editor =
               this.formCustom.editor ||
               CodeMirror.fromTextArea(textarea, {
                 mode: `javascript`,
-              });
-            this.formCustom.editor.setValue(this.formCustom.code);
-          });
+              })
+            this.formCustom.editor.setValue(this.formCustom.code)
+          })
         }
       },
     },
   },
   mounted() {},
-};
+}
 </script>
 
 <style lang="less" scoped>
@@ -696,8 +696,8 @@ export default {
     /deep/ .CodeMirror {
       border: 1px solid #eee;
       height: 300px !important;
-      font-family: "Fira Mono", "DejaVu Sans Mono", Menlo, Consolas,
-        "Liberation Mono", Monaco, "Lucida Console", monospace !important;
+      font-family: 'Fira Mono', 'DejaVu Sans Mono', Menlo, Consolas,
+        'Liberation Mono', Monaco, 'Lucida Console', monospace !important;
       line-height: 20px;
       .CodeMirror-scroll {
         padding: 10px;
diff --git a/src/components/Loading.vue b/src/components/Loading.vue
index f090fb3..c131cc8 100644
--- a/src/components/Loading.vue
+++ b/src/components/Loading.vue
@@ -41,7 +41,7 @@
   display: inline-block;
   width: 100px;
   height: 100px;
-  background: url("../assets/images/favicon.png") no-repeat;
+  background: url('../assets/images/favicon.png') no-repeat;
   background-size: cover;
 }
 </style>
diff --git a/src/main.js b/src/main.js
index 2e610f6..dd9f989 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,29 +1,29 @@
-import Vue from "vue";
-import App from "./App";
-import store from "./store";
-import ElementUI from "element-ui";
-import "element-ui/lib/theme-chalk/index.css";
-import "./plugins/element";
-import "codemirror/lib/codemirror.css";
-import "codemirror/theme/xq-light.css";
-import "codemirror/mode/css/css";
-import "codemirror/mode/markdown/markdown";
-import "codemirror/addon/edit/closebrackets";
-import "codemirror/addon/edit/matchbrackets";
-import "codemirror/addon/selection/active-line";
-import "codemirror/addon/hint/show-hint.js";
-import "codemirror/addon/hint/css-hint.js";
-import router from './router';
+import Vue from 'vue'
+import App from './App'
+import store from './store'
+import ElementUI from 'element-ui'
+import 'element-ui/lib/theme-chalk/index.css'
+import './plugins/element'
+import 'codemirror/lib/codemirror.css'
+import 'codemirror/theme/xq-light.css'
+import 'codemirror/mode/css/css'
+import 'codemirror/mode/markdown/markdown'
+import 'codemirror/addon/edit/closebrackets'
+import 'codemirror/addon/edit/matchbrackets'
+import 'codemirror/addon/selection/active-line'
+import 'codemirror/addon/hint/show-hint.js'
+import 'codemirror/addon/hint/css-hint.js'
+import router from './router'
 
-Vue.use(ElementUI);
+Vue.use(ElementUI)
 
-Vue.config.productionTip = false;
+Vue.config.productionTip = false
 
-App.mpType = "app";
+App.mpType = `app`
 
 const app = new Vue({
   router,
   store,
   ...App,
-});
-app.$mount("#app");
+})
+app.$mount(`#app`)
diff --git a/src/pages/index/index.vue b/src/pages/index/index.vue
index 4553748..f34e309 100644
--- a/src/pages/index/index.vue
+++ b/src/pages/index/index.vue
@@ -6,10 +6,10 @@
 </template>
 
 <script>
-import Loading from "../../components/Loading";
-import CodemirrorEditor from "./view/CodemirrorEditor";
+import Loading from '../../components/Loading'
+import CodemirrorEditor from './view/CodemirrorEditor'
 export default {
-  name: "App",
+  name: `App`,
   components: {
     Loading,
     CodemirrorEditor,
@@ -17,14 +17,14 @@ export default {
   data() {
     return {
       loading: true,
-    };
+    }
   },
   mounted() {
     setTimeout(() => {
-      this.loading = false;
-    }, 100);
+      this.loading = false
+    }, 100)
   },
-};
+}
 </script>
 
 <style scoped>
diff --git a/src/pages/index/view/CodemirrorEditor.vue b/src/pages/index/view/CodemirrorEditor.vue
index 5b64c48..a55023f 100644
--- a/src/pages/index/view/CodemirrorEditor.vue
+++ b/src/pages/index/view/CodemirrorEditor.vue
@@ -12,7 +12,7 @@
           @show-about-dialog="aboutDialogVisible = true"
           @show-dialog-form="dialogFormVisible = true"
           @show-dialog-upload-img="dialogUploadImgVisible = true"
-          @startCopy="(isCoping = true), (backLight = true)"
+          @startCopy=";(isCoping = true), (backLight = true)"
           @endCopy="endCopy"
         />
       </el-header>
@@ -93,11 +93,11 @@
   </div>
 </template>
 <script>
-import editorHeader from "../../../components/CodemirrorEditor/header";
-import aboutDialog from "../../../components/CodemirrorEditor/aboutDialog";
-import insertFormDialog from "../../../components/CodemirrorEditor/insertForm";
-import rightClickMenu from "../../../components/CodemirrorEditor/rightClickMenu";
-import uploadImgDialog from "../../../components/CodemirrorEditor/uploadImgDialog";
+import editorHeader from '../../../components/CodemirrorEditor/header'
+import aboutDialog from '../../../components/CodemirrorEditor/aboutDialog'
+import insertFormDialog from '../../../components/CodemirrorEditor/insertForm'
+import rightClickMenu from '../../../components/CodemirrorEditor/rightClickMenu'
+import uploadImgDialog from '../../../components/CodemirrorEditor/uploadImgDialog'
 
 import {
   css2json,
@@ -108,13 +108,13 @@ import {
   saveEditorContent,
   customCssWithTemplate,
   checkImage,
-} from "../../../assets/scripts/util";
+} from '../../../assets/scripts/util'
 
-import { toBase64 } from "../../../assets/scripts/util";
-import fileApi from "../../../api/file";
+import { toBase64 } from '../../../assets/scripts/util'
+import fileApi from '../../../api/file'
 
-require("codemirror/mode/javascript/javascript");
-import { mapState, mapMutations } from "vuex";
+require(`codemirror/mode/javascript/javascript`)
+import { mapState, mapMutations } from 'vuex'
 export default {
   data() {
     return {
@@ -127,10 +127,10 @@ export default {
       backLight: false,
       timeout: null,
       changeTimer: null,
-      source: "",
+      source: ``,
       mouseLeft: 0,
       mouseTop: 0,
-    };
+    }
   },
   components: {
     editorHeader,
@@ -153,304 +153,304 @@ export default {
     }),
   },
   created() {
-    this.initEditorState();
+    this.initEditorState()
     this.$nextTick(() => {
-      this.initEditor();
-      this.initCssEditor();
-      this.onEditorRefresh();
-    });
+      this.initEditor()
+      this.initCssEditor()
+      this.onEditorRefresh()
+    })
   },
   methods: {
     initEditor() {
-      this.initEditorEntity();
-      this.editor.on("change", (cm, e) => {
-        if (this.changeTimer) clearTimeout(this.changeTimer);
+      this.initEditorEntity()
+      this.editor.on(`change`, (cm, e) => {
+        if (this.changeTimer) clearTimeout(this.changeTimer)
         this.changeTimer = setTimeout(() => {
-          this.onEditorRefresh();
-          saveEditorContent(this.editor, "__editor_content");
-        }, 300);
-      });
+          this.onEditorRefresh()
+          saveEditorContent(this.editor, `__editor_content`)
+        }, 300)
+      })
 
       // 粘贴上传图片并插入
-      this.editor.on("paste", (cm, e) => {
+      this.editor.on(`paste`, (cm, e) => {
         if (!(e.clipboardData && e.clipboardData.items) || this.isImgLoading) {
-          return;
+          return
         }
         for (let i = 0, len = e.clipboardData.items.length; i < len; ++i) {
-          let item = e.clipboardData.items[i];
-          if (item.kind === "file") {
+          let item = e.clipboardData.items[i]
+          if (item.kind === `file`) {
             // 校验图床参数
-            const pasteFile = item.getAsFile();
-            const isValid = this.beforeUpload(pasteFile);
+            const pasteFile = item.getAsFile()
+            const isValid = this.beforeUpload(pasteFile)
             if (!isValid) {
-              continue;
+              continue
             }
-            this.uploadImage(pasteFile);
+            this.uploadImage(pasteFile)
           }
         }
-      });
+      })
 
-      this.editor.on("mousedown", () => {
-        this.$store.commit("setRightClickMenuVisible", false);
-      });
-      this.editor.on("blur", () => {
+      this.editor.on(`mousedown`, () => {
+        this.$store.commit(`setRightClickMenuVisible`, false)
+      })
+      this.editor.on(`blur`, () => {
         //!影响到右键菜单的点击事件，右键菜单的点击事件在组件内通过mousedown触发
-        this.$store.commit("setRightClickMenuVisible", false);
-      });
-      this.editor.on("scroll", () => {
-        this.$store.commit("setRightClickMenuVisible", false);
-      });
+        this.$store.commit(`setRightClickMenuVisible`, false)
+      })
+      this.editor.on(`scroll`, () => {
+        this.$store.commit(`setRightClickMenuVisible`, false)
+      })
     },
     initCssEditor() {
-      this.initCssEditorEntity();
+      this.initCssEditorEntity()
       // 自动提示
-      this.cssEditor.on("keyup", (cm, e) => {
+      this.cssEditor.on(`keyup`, (cm, e) => {
         if ((e.keyCode >= 65 && e.keyCode <= 90) || e.keyCode === 189) {
-          cm.showHint(e);
+          cm.showHint(e)
         }
-      });
-      this.cssEditor.on("update", (instance) => {
-        this.cssChanged();
-        saveEditorContent(this.cssEditor, "__css_content");
-      });
+      })
+      this.cssEditor.on(`update`, (instance) => {
+        this.cssChanged()
+        saveEditorContent(this.cssEditor, `__css_content`)
+      })
     },
     cssChanged() {
-      let json = css2json(this.cssEditor.getValue(0));
-      let theme = setFontSize(this.currentSize.replace("px", ""));
+      let json = css2json(this.cssEditor.getValue(0))
+      let theme = setFontSize(this.currentSize.replace(`px`, ``))
 
-      theme = customCssWithTemplate(json, this.currentColor, theme);
+      theme = customCssWithTemplate(json, this.currentColor, theme)
       this.setWxRendererOptions({
         theme: theme,
-      });
-      this.onEditorRefresh();
+      })
+      this.onEditorRefresh()
     },
     // 切换 highlight.js 代码主题
     codeThemeChanged() {
-      let cssUrl = this.codeTheme;
-      let el = document.getElementById('hljs')
+      let cssUrl = this.codeTheme
+      let el = document.getElementById(`hljs`)
       if (el != undefined) {
-        el.setAttribute('href', cssUrl);
+        el.setAttribute(`href`, cssUrl)
       } else {
-        var link = document.createElement('link');
-        link.setAttribute('type','text/css');
-        link.setAttribute('rel','stylesheet');
-        link.setAttribute('href',cssUrl);
-        link.setAttribute('id','hljs');
-        document.head.appendChild(link);
+        var link = document.createElement(`link`)
+        link.setAttribute(`type`, `text/css`)
+        link.setAttribute(`rel`, `stylesheet`)
+        link.setAttribute(`href`, cssUrl)
+        link.setAttribute(`id`, `hljs`)
+        document.head.appendChild(link)
       }
     },
     beforeUpload(file) {
       // validate image
-      const checkResult = checkImage(file);
+      const checkResult = checkImage(file)
       if (!checkResult.ok) {
-        this.$message.error(checkResult.msg);
-        return false;
+        this.$message.error(checkResult.msg)
+        return false
       }
 
       // check image host
-      let imgHost = localStorage.getItem("imgHost");
-      imgHost = imgHost ? imgHost : "default";
-      localStorage.setItem("imgHost", imgHost);
+      let imgHost = localStorage.getItem(`imgHost`)
+      imgHost = imgHost ? imgHost : `default`
+      localStorage.setItem(`imgHost`, imgHost)
 
-      const config = localStorage.getItem(`${imgHost}Config`);
-      const isValidHost = imgHost == "default" || config;
+      const config = localStorage.getItem(`${imgHost}Config`)
+      const isValidHost = imgHost == `default` || config
       if (!isValidHost) {
-        this.$message.error(`请先配置 ${imgHost} 图床参数`);
-        return false;
+        this.$message.error(`请先配置 ${imgHost} 图床参数`)
+        return false
       }
-      return true;
+      return true
     },
     uploadImage(file) {
-      this.isImgLoading = true;
+      this.isImgLoading = true
       toBase64(file)
         .then((base64Content) => {
           fileApi
             .fileUpload(base64Content, file)
             .then((url) => {
               console.log(url)
-              this.uploaded(url);
+              this.uploaded(url)
             })
             .catch((err) => {
-              this.$message.error(err.message);
-            });
+              this.$message.error(err.message)
+            })
         })
         .catch((err) => {
-          this.$message.error(err.message);
-        });
-      this.isImgLoading = false;
+          this.$message.error(err.message)
+        })
+      this.isImgLoading = false
     },
     // 图片上传结束
     uploaded(response) {
-      console.log("图片上传之后: ", response)
+      console.log(`图片上传之后: `, response)
       if (!response) {
-        this.$message.error("上传图片未知异常");
-        return;
+        this.$message.error(`上传图片未知异常`)
+        return
       }
-      this.dialogUploadImgVisible = false;
+      this.dialogUploadImgVisible = false
       // 上传成功，获取光标
-      const cursor = this.editor.getCursor();
-      const imageUrl = response;
-      const markdownImage = `![](${imageUrl})`;
+      const cursor = this.editor.getCursor()
+      const imageUrl = response
+      const markdownImage = `![](${imageUrl})`
       // 将 Markdown 形式的 URL 插入编辑框光标所在位置
-      this.editor.replaceSelection(`\n${markdownImage}\n`, cursor);
-      this.$message.success("图片上传成功");
-      this.onEditorRefresh();
+      this.editor.replaceSelection(`\n${markdownImage}\n`, cursor)
+      this.$message.success(`图片上传成功`)
+      this.onEditorRefresh()
     },
     // 左右滚动
     leftAndRightScroll() {
       const scrollCB = (text) => {
-        let source, target;
+        let source, target
 
-        clearTimeout(this.timeout);
-        if (text === "preview") {
-          source = this.$refs.preview.$el;
-          target = document.getElementsByClassName("CodeMirror-scroll")[0];
-          this.editor.off("scroll", editorScrollCB);
+        clearTimeout(this.timeout)
+        if (text === `preview`) {
+          source = this.$refs.preview.$el
+          target = document.getElementsByClassName(`CodeMirror-scroll`)[0]
+          this.editor.off(`scroll`, editorScrollCB)
           this.timeout = setTimeout(() => {
-            this.editor.on("scroll", editorScrollCB);
-          }, 300);
-        } else if (text === "editor") {
-          source = document.getElementsByClassName("CodeMirror-scroll")[0];
-          target = this.$refs.preview.$el;
-          target.removeEventListener("scroll", previewScrollCB, false);
+            this.editor.on(`scroll`, editorScrollCB)
+          }, 300)
+        } else if (text === `editor`) {
+          source = document.getElementsByClassName(`CodeMirror-scroll`)[0]
+          target = this.$refs.preview.$el
+          target.removeEventListener(`scroll`, previewScrollCB, false)
           this.timeout = setTimeout(() => {
-            target.addEventListener("scroll", previewScrollCB, false);
-          }, 300);
+            target.addEventListener(`scroll`, previewScrollCB, false)
+          }, 300)
         }
 
         let percentage =
-          source.scrollTop / (source.scrollHeight - source.offsetHeight);
-        let height = percentage * (target.scrollHeight - target.offsetHeight);
+          source.scrollTop / (source.scrollHeight - source.offsetHeight)
+        let height = percentage * (target.scrollHeight - target.offsetHeight)
 
-        target.scrollTo(0, height);
-      };
+        target.scrollTo(0, height)
+      }
       const editorScrollCB = () => {
-        scrollCB("editor");
-      };
+        scrollCB(`editor`)
+      }
       const previewScrollCB = () => {
-        scrollCB("preview");
-      };
+        scrollCB(`preview`)
+      }
 
-      this.$refs.preview.$el.addEventListener("scroll", previewScrollCB, false);
-      this.editor.on("scroll", editorScrollCB);
+      this.$refs.preview.$el.addEventListener(`scroll`, previewScrollCB, false)
+      this.editor.on(`scroll`, editorScrollCB)
     },
     // 更新编辑器
     onEditorRefresh() {
-      this.codeThemeChanged(this.codeTheme);
-      this.editorRefresh();
-      setTimeout(() => PR.prettyPrint(), 0);
+      this.codeThemeChanged(this.codeTheme)
+      this.editorRefresh()
+      setTimeout(() => window.PR.prettyPrint(), 0)
     },
     // 复制结束
     endCopy() {
-      this.backLight = false;
+      this.backLight = false
       setTimeout(() => {
-        this.isCoping = false;
-      }, 800);
+        this.isCoping = false
+      }, 800)
     },
     // 导出编辑器内容到本地
     downloadEditorContent() {
-      downloadMD(this.editor.getValue(0));
+      downloadMD(this.editor.getValue(0))
     },
     // 导出编辑器内容为 HTML，并且下载到本地
     exportEditorContent() {
       this.$nextTick(() => {
-        exportHTML();
-      });
+        exportHTML()
+      })
     },
     // 导入 Markdown 文档
     importMarkdownContent() {
-      let menu = document.getElementById("menu");
-      let input = document.createElement("input");
-      input.type = "file";
-      input.name = "filename";
-      input.accept = ".txt,.md";
-      menu.appendChild(input);
+      let menu = document.getElementById(`menu`)
+      let input = document.createElement(`input`)
+      input.type = `file`
+      input.name = `filename`
+      input.accept = `.txt,.md`
+      menu.appendChild(input)
       input.onchange = () => {
         if (!input.files) {
-          return;
+          return
         }
-        const file = input.files[0];
+        const file = input.files[0]
         if (!/\.(txt|TXT|MD|md)$/.test(file.name)) {
-          this.$message.error("不支持的文档格式");
-          return;
+          this.$message.error(`不支持的文档格式`)
+          return
         }
-        const reader = new FileReader();
-        reader.readAsText(file);
+        const reader = new FileReader()
+        reader.readAsText(file)
         reader.onload = (event) => {
-          let txt = event.target.result;
-          txt = formatDoc(txt);
+          let txt = event.target.result
+          txt = formatDoc(txt)
           if (txt) {
-            localStorage.setItem("__editor_content", txt);
-            this.editor.setValue(txt);
-            this.$message.success("文档导入成功");
+            localStorage.setItem(`__editor_content`, txt)
+            this.editor.setValue(txt)
+            this.$message.success(`文档导入成功`)
           }
-        };
-      };
-      input.click();
-      menu.removeChild(input);
+        }
+      }
+      input.click()
+      menu.removeChild(input)
     },
     // 格式化文档
     formatContent() {
-      const doc = formatDoc(this.editor.getValue(0));
-      localStorage.setItem("__editor_content", doc);
-      this.editor.setValue(doc);
+      const doc = formatDoc(this.editor.getValue(0))
+      localStorage.setItem(`__editor_content`, doc)
+      this.editor.setValue(doc)
     },
     // 右键菜单
     openMenu(e) {
-      const menuMinWidth = 105;
-      const offsetLeft = this.$el.getBoundingClientRect().left;
-      const offsetWidth = this.$el.offsetWidth;
-      const maxLeft = offsetWidth - menuMinWidth;
-      const left = e.clientX - offsetLeft;
-      this.mouseLeft = Math.min(maxLeft, left);
-      this.mouseTop = e.clientY + 10;
-      this.$store.commit("setRightClickMenuVisible", true);
+      const menuMinWidth = 105
+      const offsetLeft = this.$el.getBoundingClientRect().left
+      const offsetWidth = this.$el.offsetWidth
+      const maxLeft = offsetWidth - menuMinWidth
+      const left = e.clientX - offsetLeft
+      this.mouseLeft = Math.min(maxLeft, left)
+      this.mouseTop = e.clientY + 10
+      this.$store.commit(`setRightClickMenuVisible`, true)
     },
     closeRightClickMenu() {
-      this.$store.commit("setRightClickMenuVisible", false);
+      this.$store.commit(`setRightClickMenuVisible`, false)
     },
     onMenuEvent(type, info = {}) {
       switch (type) {
-        case "resetStyle":
-          this.$refs.header.showResetConfirm = true;
-          break;
-        case "insertPic":
-          this.dialogUploadImgVisible = true;
-          break;
-        case "download":
-          this.downloadEditorContent();
-          break;
-        case "export":
-          this.exportEditorContent();
-          break;
-        case "insertTable":
-          this.dialogFormVisible = true;
-          break;
-        case "importMarkdown":
-          this.importMarkdownContent();
-          break;
-        case "formatMarkdown":
-          this.formatContent();
-          break;
+        case `resetStyle`:
+          this.$refs.header.showResetConfirm = true
+          break
+        case `insertPic`:
+          this.dialogUploadImgVisible = true
+          break
+        case `download`:
+          this.downloadEditorContent()
+          break
+        case `export`:
+          this.exportEditorContent()
+          break
+        case `insertTable`:
+          this.dialogFormVisible = true
+          break
+        case `importMarkdown`:
+          this.importMarkdownContent()
+          break
+        case `formatMarkdown`:
+          this.formatContent()
+          break
         default:
-          break;
+          break
       }
     },
     ...mapMutations([
-      "initEditorState",
-      "initEditorEntity",
-      "setWxRendererOptions",
-      "editorRefresh",
-      "initCssEditorEntity",
+      `initEditorState`,
+      `initEditorEntity`,
+      `setWxRendererOptions`,
+      `editorRefresh`,
+      `initCssEditorEntity`,
     ]),
   },
   mounted() {
     setTimeout(() => {
-      this.leftAndRightScroll();
-      PR.prettyPrint();
-    }, 300);
+      this.leftAndRightScroll()
+      window.PR.prettyPrint()
+    }, 300)
   },
-};
+}
 </script>
 
 <style lang="less" scoped>
@@ -506,7 +506,7 @@ export default {
     width: 50px;
     height: 50px;
     transform: translate(-50%, -50%);
-    background: url("../../../assets/images/favicon.png") no-repeat;
+    background: url('../../../assets/images/favicon.png') no-repeat;
     background-size: cover;
   }
   span {
@@ -556,5 +556,5 @@ export default {
 }
 </style>
 <style lang="less" scoped>
-@import url("../../../assets/less/app.less");
+@import url('../../../assets/less/app.less');
 </style>
diff --git a/src/plugins/element/index.js b/src/plugins/element/index.js
index 5ebbd87..26e4cda 100644
--- a/src/plugins/element/index.js
+++ b/src/plugins/element/index.js
@@ -1,10 +1,7 @@
-import Vue from "vue";
-import {
-  Loading,
-  Message,
-} from "element-ui";
+import Vue from 'vue'
+import { Loading, Message } from 'element-ui'
 
-Vue.component(Message.name, Message);
+Vue.component(Message.name, Message)
 
-Vue.prototype.$loading = Loading.service;
-Vue.prototype.$message = Message;
+Vue.prototype.$loading = Loading.service
+Vue.prototype.$message = Message
diff --git a/src/router/index.js b/src/router/index.js
index b850506..0545ef9 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -9,7 +9,7 @@ const routes = [
     path: `/`,
     name: `index`,
     component: index,
-  }
+  },
 ]
 
 const router = new VueRouter({
diff --git a/src/store/index.js b/src/store/index.js
index d38456b..4fb6e18 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -1,162 +1,162 @@
-import Vue from "vue";
-import Vuex from "vuex";
-import config from "../assets/scripts/config";
-import WxRenderer from "../assets/scripts/renderers/wx-renderer";
-import { marked } from "marked";
-import CodeMirror from "codemirror/lib/codemirror";
-import DEFAULT_CONTENT from "@/assets/example/markdown.md";
-import DEFAULT_CSS_CONTENT from "@/assets/example/theme-css.txt";
-import { setColor, formatDoc, formatCss } from "../assets/scripts/util";
+import Vue from 'vue'
+import Vuex from 'vuex'
+import config from '../assets/scripts/config'
+import WxRenderer from '../assets/scripts/renderers/wx-renderer'
+import { marked } from 'marked'
+import CodeMirror from 'codemirror/lib/codemirror'
+import DEFAULT_CONTENT from '@/assets/example/markdown.md'
+import DEFAULT_CSS_CONTENT from '@/assets/example/theme-css.txt'
+import { setColor, formatDoc, formatCss } from '../assets/scripts/util'
 
-Vue.use(Vuex);
+Vue.use(Vuex)
 
 const state = {
   wxRenderer: null,
-  output: "",
-  html: "",
+  output: ``,
+  html: ``,
   editor: null,
   cssEditor: null,
-  currentFont: "",
-  currentSize: "",
-  currentColor: "",
+  currentFont: ``,
+  currentSize: ``,
+  currentColor: ``,
   citeStatus: 0,
   nightMode: false,
   codeTheme: config.codeThemeOption[0].value,
   rightClickMenuVisible: false,
-};
+}
 const mutations = {
   setEditorValue(state, data) {
-    state.editor.setValue(data);
+    state.editor.setValue(data)
   },
   setCssEditorValue(state, data) {
-    state.cssEditor.setValue(data);
+    state.cssEditor.setValue(data)
   },
   setWxRendererOptions(state, data) {
-    state.wxRenderer.setOptions(data);
+    state.wxRenderer.setOptions(data)
   },
   setCiteStatus(state, data) {
-    state.citeStatus = data;
-    localStorage.setItem("citeStatus", data);
+    state.citeStatus = data
+    localStorage.setItem(`citeStatus`, data)
   },
   setCurrentFont(state, data) {
-    state.currentFont = data;
-    localStorage.setItem("fonts", data);
+    state.currentFont = data
+    localStorage.setItem(`fonts`, data)
   },
   setCurrentSize(state, data) {
-    state.currentSize = data;
-    localStorage.setItem("size", data);
+    state.currentSize = data
+    localStorage.setItem(`size`, data)
   },
   setCurrentColor(state, data) {
-    state.currentColor = data;
-    localStorage.setItem("color", data);
+    state.currentColor = data
+    localStorage.setItem(`color`, data)
   },
   setCurrentCodeTheme(state, data) {
-    state.codeTheme = data;
-    localStorage.setItem("codeTheme", data);
+    state.codeTheme = data
+    localStorage.setItem(`codeTheme`, data)
   },
   setRightClickMenuVisible(state, data) {
-    state.rightClickMenuVisible = data;
+    state.rightClickMenuVisible = data
   },
   themeChanged(state) {
-    state.nightMode = !state.nightMode;
-    localStorage.setItem("nightMode", state.nightMode);
+    state.nightMode = !state.nightMode
+    localStorage.setItem(`nightMode`, state.nightMode)
   },
   initEditorState(state) {
     state.currentFont =
-      localStorage.getItem("fonts") || config.builtinFonts[0].value;
+      localStorage.getItem(`fonts`) || config.builtinFonts[0].value
     state.currentColor =
-      localStorage.getItem("color") || config.colorOption[0].value;
+      localStorage.getItem(`color`) || config.colorOption[0].value
     state.currentSize =
-      localStorage.getItem("size") || config.sizeOption[2].value;
+      localStorage.getItem(`size`) || config.sizeOption[2].value
     state.codeTheme =
-      localStorage.getItem("codeTheme") || config.codeThemeOption[0].value;
-    state.citeStatus = localStorage.getItem("citeStatus") === "true";
-    state.nightMode = localStorage.getItem("nightMode") === "true";
+      localStorage.getItem(`codeTheme`) || config.codeThemeOption[0].value
+    state.citeStatus = localStorage.getItem(`citeStatus`) === `true`
+    state.nightMode = localStorage.getItem(`nightMode`) === `true`
     state.wxRenderer = new WxRenderer({
       theme: setColor(state.currentColor),
       fonts: state.currentFont,
       size: state.currentSize,
-    });
+    })
   },
   initEditorEntity(state) {
-    const editorDom = document.getElementById("editor");
+    const editorDom = document.getElementById(`editor`)
 
     if (!editorDom.value) {
       editorDom.value =
-        localStorage.getItem("__editor_content") || formatDoc(DEFAULT_CONTENT);
+        localStorage.getItem(`__editor_content`) || formatDoc(DEFAULT_CONTENT)
     }
     state.editor = CodeMirror.fromTextArea(editorDom, {
-      mode: "text/x-markdown",
-      theme: "xq-light",
+      mode: `text/x-markdown`,
+      theme: `xq-light`,
       lineNumbers: false,
       lineWrapping: true,
       styleActiveLine: true,
       autoCloseBrackets: true,
       extraKeys: {
-        "Ctrl-F": function autoFormat(editor) {
-          const doc = formatDoc(editor.getValue(0));
-          localStorage.setItem("__editor_content", doc);
-          editor.setValue(doc);
+        'Ctrl-F': function autoFormat(editor) {
+          const doc = formatDoc(editor.getValue(0))
+          localStorage.setItem(`__editor_content`, doc)
+          editor.setValue(doc)
         },
-        "Ctrl-S": function save(editor) {},
-        "Ctrl-B": function bold(editor) {
-          const selected = editor.getSelection();
-          editor.replaceSelection(`**${selected}**`);
+        'Ctrl-S': function save(editor) {},
+        'Ctrl-B': function bold(editor) {
+          const selected = editor.getSelection()
+          editor.replaceSelection(`**${selected}**`)
         },
-        "Ctrl-D": function del(editor) {
-          const selected = editor.getSelection();
-          editor.replaceSelection(`~~${selected}~~`);
+        'Ctrl-D': function del(editor) {
+          const selected = editor.getSelection()
+          editor.replaceSelection(`~~${selected}~~`)
         },
-        "Ctrl-I": function italic(editor) {
-          const selected = editor.getSelection();
-          editor.replaceSelection(`*${selected}*`);
+        'Ctrl-I': function italic(editor) {
+          const selected = editor.getSelection()
+          editor.replaceSelection(`*${selected}*`)
         },
       },
-    });
+    })
   },
   initCssEditorEntity(state) {
-    const cssEditorDom = document.getElementById("cssEditor");
+    const cssEditorDom = document.getElementById(`cssEditor`)
 
     if (!cssEditorDom.value) {
       cssEditorDom.value =
-        localStorage.getItem("__css_content") || DEFAULT_CSS_CONTENT;
+        localStorage.getItem(`__css_content`) || DEFAULT_CSS_CONTENT
     }
     state.cssEditor = CodeMirror.fromTextArea(cssEditorDom, {
-      mode: "css",
-      theme: "style-mirror",
+      mode: `css`,
+      theme: `style-mirror`,
       lineNumbers: false,
       lineWrapping: true,
       matchBrackets: true,
       autofocus: true,
       extraKeys: {
-        "Ctrl-F": function autoFormat(editor) {
-          const doc = formatCss(editor.getValue(0));
-          localStorage.setItem("__css_content", doc);
-          editor.setValue(doc);
+        'Ctrl-F': function autoFormat(editor) {
+          const doc = formatCss(editor.getValue(0))
+          localStorage.setItem(`__css_content`, doc)
+          editor.setValue(doc)
         },
-        "Ctrl-S": function save(editor) {},
+        'Ctrl-S': function save(editor) {},
       },
-    });
+    })
   },
   editorRefresh(state) {
-    let renderer = state.wxRenderer.getRenderer(state.citeStatus);
-    marked.setOptions({ renderer });
-    let output = marked.parse(state.editor.getValue(0));
+    let renderer = state.wxRenderer.getRenderer(state.citeStatus)
+    marked.setOptions({ renderer })
+    let output = marked.parse(state.editor.getValue(0))
 
     // 去除第一行的 margin-top
-    output = output.replace(/(style=".*?)"/, '$1;margin-top: 0"');
+    output = output.replace(/(style=".*?)"/, `$1;margin-top: 0"`)
     if (state.citeStatus) {
       // 引用脚注
-      output += state.wxRenderer.buildFootnotes();
+      output += state.wxRenderer.buildFootnotes()
       // 附加的一些 style
-      output += state.wxRenderer.buildAddition();
+      output += state.wxRenderer.buildAddition()
     }
-    state.output = output;
+    state.output = output
   },
-};
+}
 
 export default new Vuex.Store({
   state,
   mutations,
   actions: {},
-});
+})
diff --git a/vue.config.js b/vue.config.js
index 0335098..6c8db8c 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -5,9 +5,11 @@ module.exports = {
   configureWebpack: (config) => {
     config.module.rules.push({
       test: /\.(txt|md)$/i,
-      use: [{
-        loader: 'raw-loader',
-      }]
+      use: [
+        {
+          loader: `raw-loader`,
+        },
+      ],
     })
   },
   productionSourceMap: !isProd,