From 822b36e166c1108f320a5cc981e0f48c2640eca6 Mon Sep 17 00:00:00 2001 From: Franck Date: Tue, 29 Oct 2019 10:15:29 +0100 Subject: [PATCH] feat: Add some markdow config --- .../ui/config/defaultThemeConfig/searchBox.js | 6 ++- .../ui/config/generalConfig/basic.js | 6 ++- .../ui/config/generalConfig/index.js | 4 +- .../ui/config/generalConfig/markdown.js | 16 ------- .../ui/config/markdownConfig/index.js | 32 +++++++++++++ .../vue-cli-plugin-vuepress/ui/config/read.js | 45 ++++++++++++++----- .../ui/config/validators.js | 15 ++++++- .../ui/config/write.js | 21 ++------- 8 files changed, 93 insertions(+), 52 deletions(-) delete mode 100644 packages/@vuepress/vue-cli-plugin-vuepress/ui/config/generalConfig/markdown.js create mode 100644 packages/@vuepress/vue-cli-plugin-vuepress/ui/config/markdownConfig/index.js diff --git a/packages/@vuepress/vue-cli-plugin-vuepress/ui/config/defaultThemeConfig/searchBox.js b/packages/@vuepress/vue-cli-plugin-vuepress/ui/config/defaultThemeConfig/searchBox.js index 05dfafae..38a76cbc 100644 --- a/packages/@vuepress/vue-cli-plugin-vuepress/ui/config/defaultThemeConfig/searchBox.js +++ b/packages/@vuepress/vue-cli-plugin-vuepress/ui/config/defaultThemeConfig/searchBox.js @@ -1,6 +1,8 @@ const get = require('lodash/get') +const { isNumber } = require('../validators') + const GROUP_NAME = 'Search box' module.exports = data => ([ @@ -22,7 +24,9 @@ module.exports = data => ([ link: 'https://vuepress.vuejs.org/theme/default-theme-config.html#built-in-search', group: GROUP_NAME, value: get(data, 'config.themeConfig.searchMaxSuggestions'), - default: '5' + default: '5', + validate: isNumber, + transform: Number }, { name: 'themeConfig.searchPlaceholder', diff --git a/packages/@vuepress/vue-cli-plugin-vuepress/ui/config/generalConfig/basic.js b/packages/@vuepress/vue-cli-plugin-vuepress/ui/config/generalConfig/basic.js index 6d1e76e6..e663234a 100644 --- a/packages/@vuepress/vue-cli-plugin-vuepress/ui/config/generalConfig/basic.js +++ b/packages/@vuepress/vue-cli-plugin-vuepress/ui/config/generalConfig/basic.js @@ -1,4 +1,4 @@ -const { required } = require('../validators') +const { required, isNumber } = require('../validators') const GROUP_NAME = 'Basic settings' @@ -51,7 +51,9 @@ module.exports = data => ([ link: 'https://vuepress.vuejs.org/config/#port', group: GROUP_NAME, value: data.config.port, - default: '8080' + default: '8080', + validate: isNumber, + transform: Number }, { name: 'temp', diff --git a/packages/@vuepress/vue-cli-plugin-vuepress/ui/config/generalConfig/index.js b/packages/@vuepress/vue-cli-plugin-vuepress/ui/config/generalConfig/index.js index 5704a6bb..e629406d 100644 --- a/packages/@vuepress/vue-cli-plugin-vuepress/ui/config/generalConfig/index.js +++ b/packages/@vuepress/vue-cli-plugin-vuepress/ui/config/generalConfig/index.js @@ -1,9 +1,7 @@ const flattenDeep = require('lodash/flattenDeep') const basic = require('./basic') -const markdown = require('./markdown') module.exports = data => flattenDeep([ - basic(data), - markdown(data) + basic(data) ]) diff --git a/packages/@vuepress/vue-cli-plugin-vuepress/ui/config/generalConfig/markdown.js b/packages/@vuepress/vue-cli-plugin-vuepress/ui/config/generalConfig/markdown.js deleted file mode 100644 index ea9fd3b0..00000000 --- a/packages/@vuepress/vue-cli-plugin-vuepress/ui/config/generalConfig/markdown.js +++ /dev/null @@ -1,16 +0,0 @@ -const get = require('lodash/get') - -const GROUP_NAME = 'Markdown settings' - -module.exports = data => ([ - { - name: 'markdown.lineNumbers', - type: 'confirm', - message: 'Display line numbers', - description: 'Whether to show line numbers to the left of each code blocks.', - link: 'https://vuepress.vuejs.org/config/#markdown-linenumbers', - group: GROUP_NAME, - value: get(data, 'config.markdown.lineNumbers'), - default: undefined - } -]) diff --git a/packages/@vuepress/vue-cli-plugin-vuepress/ui/config/markdownConfig/index.js b/packages/@vuepress/vue-cli-plugin-vuepress/ui/config/markdownConfig/index.js new file mode 100644 index 00000000..e1a20592 --- /dev/null +++ b/packages/@vuepress/vue-cli-plugin-vuepress/ui/config/markdownConfig/index.js @@ -0,0 +1,32 @@ +const get = require('lodash/get') + +const { isJSON } = require('../validators') + +const GROUP_NAME = 'Markdown settings' + +module.exports = data => ([ + { + name: 'markdown.lineNumbers', + type: 'confirm', + message: 'Display line numbers for code blocks', + description: 'Whether to show line numbers to the left of each code blocks.', + link: 'https://vuepress.vuejs.org/config/#markdown-linenumbers', + group: GROUP_NAME, + value: get(data, 'config.markdown.lineNumbers'), + default: undefined + }, + { + name: 'markdown.toc', + type: 'editor', + message: 'Table of contents options', + description: 'Options for markdown-it-table-of-contents (Note: prefer markdown.slugify to customize header ids).', + link: 'https://vuepress.vuejs.org/config/#markdown-toc', + group: GROUP_NAME, + value: get(data, 'config.markdown.toc'), + validate: isJSON, + transform: JSON.parse, + default: `{ + "includeLevel": [2, 3] +}` + } +]) diff --git a/packages/@vuepress/vue-cli-plugin-vuepress/ui/config/read.js b/packages/@vuepress/vue-cli-plugin-vuepress/ui/config/read.js index 6df246d6..2f7b5f8c 100644 --- a/packages/@vuepress/vue-cli-plugin-vuepress/ui/config/read.js +++ b/packages/@vuepress/vue-cli-plugin-vuepress/ui/config/read.js @@ -1,23 +1,46 @@ const generalConfig = require('./generalConfig') const defaultThemeConfig = require('./defaultThemeConfig') +const markdownConfig = require('./markdownConfig') -module.exports = ({ data }) => ({ - tabs: [ +module.exports = ({ data }) => { + const tabs = [ { id: 'generalConfig', - label: 'General settings', + label: 'General', icon: 'settings_applications', - prompts: [ - generalConfig - ].flatMap(getConfig => getConfig(data)) + prompts: [generalConfig] + }, + { + id: 'markdownConfig', + label: 'Markdown', + icon: 'edit', + prompts: [markdownConfig] }, { id: 'defaultThemeConfig', - label: 'Theme settings', + label: 'Theme', icon: 'palette', - prompts: [ - defaultThemeConfig - ].flatMap(getConfig => getConfig(data)) + prompts: [defaultThemeConfig] } ] -}) + + const OBJECT_PROPERTIES = [ + 'config.markdown.toc' + ] + + // When vue UI read the data source, we need to stringify object properties + // so it can be properly displayed in vue UI inputs + const getConfigData = getConfig => { + OBJECT_PROPERTIES.forEach(prop => { + data[prop] = JSON.stringify(data[prop]) + }) + + return getConfig(data) + } + + tabs.forEach(tab => { + tab.prompts = tab.prompts.flatMap(getConfigData) + }) + + return { tabs } +} diff --git a/packages/@vuepress/vue-cli-plugin-vuepress/ui/config/validators.js b/packages/@vuepress/vue-cli-plugin-vuepress/ui/config/validators.js index f0c9a460..c457253d 100644 --- a/packages/@vuepress/vue-cli-plugin-vuepress/ui/config/validators.js +++ b/packages/@vuepress/vue-cli-plugin-vuepress/ui/config/validators.js @@ -1,5 +1,18 @@ const required = input => !!input +const isJSON = input => { + try { + JSON.parse(input) + return true + } catch (e) { + return 'This input must be a valid JSON object' + } +} + +const isNumber = input => !isNaN(input) || 'This input must be a number' + module.exports = { - required + required, + isJSON, + isNumber } diff --git a/packages/@vuepress/vue-cli-plugin-vuepress/ui/config/write.js b/packages/@vuepress/vue-cli-plugin-vuepress/ui/config/write.js index db926381..b2605b63 100644 --- a/packages/@vuepress/vue-cli-plugin-vuepress/ui/config/write.js +++ b/packages/@vuepress/vue-cli-plugin-vuepress/ui/config/write.js @@ -6,29 +6,14 @@ module.exports = async ({ api, prompts }) => { result['themeConfig.nav'] = [] for (const prompt of prompts) { - result[prompt.id] = await api.getAnswer(prompt.id) + if (!prompt.error) { + result[prompt.id] = await api.getAnswer(prompt.id, prompt.raw.transform) + } } if (get(result, 'themeConfig.sidebar')) { result['themeConfig.sidebar'] = 'auto' } - convertNumberProps(result) - api.setData('config', result) } - -const NUMBER_PROPERTIES = [ - 'port', - 'themeConfig.searchMaxSuggestions' -] - -function convertNumberProps (result) { - NUMBER_PROPERTIES.forEach(prop => { - result[prop] = Number(result[prop]) - - if (isNaN(result[prop])) { - result[prop] = undefined - } - }) -}