diff --git a/packages/@vue/cli-ui/locales/en.json b/packages/@vue/cli-ui/locales/en.json index 8cd7fe538b..c13e33d214 100644 --- a/packages/@vue/cli-ui/locales/en.json +++ b/packages/@vue/cli-ui/locales/en.json @@ -443,6 +443,56 @@ "mode": "Specify env mode", "verbose": "Show full function definitions in output" } + }, + "config": { + "vue-cli": { + "description": "Configure your Vue project", + "groups": { + "general": "General settings", + "css": "CSS settings" + }, + "baseUrl": { + "label": "Base URL", + "description": "The base URL your application will be deployed at, for example '/my-app/'. Use an empty string ('') so that all assets are linked using relative paths." + }, + "outputDir": { + "label": "Output directory", + "description": "The directory where the production build files will be generated" + }, + "assetsDir": { + "label": "Assets directory", + "description": "A directory to nest generated static assets (js, css, img, fonts) under." + }, + "runtimeCompiler": { + "label": "Enable runtime compiler", + "description": "This will allow you to use the template option in Vue components, but will incur around an extra 10kb payload for your app." + }, + "productionSourceMap": { + "label": "Enable Production Source Maps", + "description": "Disabling this can speed up production builds if you don't need source maps for production" + }, + "parallel": { + "label": "Parallel compilation", + "description": "Whether to use multiple processors to compile Babel or Typescript." + }, + "css": { + "modules": { + "label": "Enable CSS Modules", + "description": "By default, only files that ends in *.module.[ext] are treated as CSS modules. Enabling this will treat all style files as CSS modules." + }, + "extract": { + "label": "Extract CSS", + "description": "Whether to extract CSS in your components into a standalone CSS files (instead of inlined in JavaScript and injected dynamically)." + }, + "sourceMap": { + "label": "Enable CSS Source Maps", + "description": "Whether to enable source maps for CSS. Enabling this may affect build performance." + } + } + } + }, + "suggestions": { + "vue-config-open": "Open vue config" } }, "eslint": { diff --git a/packages/@vue/cli-ui/ui-defaults/config.js b/packages/@vue/cli-ui/ui-defaults/config.js new file mode 100644 index 0000000000..0e45853f26 --- /dev/null +++ b/packages/@vue/cli-ui/ui-defaults/config.js @@ -0,0 +1,116 @@ +module.exports = api => { + api.describeConfig({ + id: 'vue-cli', + name: 'Vue CLI', + description: 'vue-webpack.config.vue-cli.description', + link: 'https://cli.vuejs.org/config/', + files: { + vue: { + js: ['vue.config.js'] + } + }, + icon: '/public/vue-cli.png', + onRead: ({ data }) => ({ + prompts: [ + { + name: 'baseUrl', + type: 'input', + default: '/', + value: data.vue && data.vue.baseUrl, + message: 'vue-webpack.config.vue-cli.baseUrl.label', + description: 'vue-webpack.config.vue-cli.baseUrl.description', + group: 'vue-webpack.config.vue-cli.groups.general', + link: 'https://cli.vuejs.org/config/#baseurl' + }, + { + name: 'outputDir', + type: 'input', + default: 'dist', + value: data.vue && data.vue.outputDir, + validate: input => !!input, + message: 'vue-webpack.config.vue-cli.outputDir.label', + description: 'vue-webpack.config.vue-cli.outputDir.description', + group: 'vue-webpack.config.vue-cli.groups.general', + link: 'https://cli.vuejs.org/config/#outputdir' + }, + { + name: 'assetsDir', + type: 'input', + default: '', + value: data.vue && data.vue.assetsDir, + message: 'vue-webpack.config.vue-cli.assetsDir.label', + description: 'vue-webpack.config.vue-cli.assetsDir.description', + group: 'vue-webpack.config.vue-cli.groups.general', + link: 'https://cli.vuejs.org/config/#assetsdir' + }, + { + name: 'runtimeCompiler', + type: 'confirm', + default: false, + value: data.vue && data.vue.runtimeCompiler, + message: 'vue-webpack.config.vue-cli.runtimeCompiler.label', + description: 'vue-webpack.config.vue-cli.runtimeCompiler.description', + group: 'vue-webpack.config.vue-cli.groups.general', + link: 'https://cli.vuejs.org/config/#runtimecompiler' + }, + { + name: 'productionSourceMap', + type: 'confirm', + default: true, + value: data.vue && data.vue.productionSourceMap, + message: 'vue-webpack.config.vue-cli.productionSourceMap.label', + description: 'vue-webpack.config.vue-cli.productionSourceMap.description', + group: 'vue-webpack.config.vue-cli.groups.general', + link: 'https://cli.vuejs.org/config/#productionsourcemap' + }, + { + name: 'parallel', + type: 'confirm', + default: require('os').cpus().length > 1, + value: data.vue && data.vue.parallel, + message: 'vue-webpack.config.vue-cli.parallel.label', + description: 'vue-webpack.config.vue-cli.parallel.description', + group: 'vue-webpack.config.vue-cli.groups.general', + link: 'https://cli.vuejs.org/config/#parallel' + }, + { + name: 'css.modules', + type: 'confirm', + default: false, + value: data.vue && data.vue.css && data.vue.css.modules, + message: 'vue-webpack.config.vue-cli.css.modules.label', + description: 'vue-webpack.config.vue-cli.css.modules.description', + group: 'vue-webpack.config.vue-cli.groups.css', + link: 'https://cli.vuejs.org/config/#css-modules' + }, + { + name: 'css.extract', + type: 'confirm', + default: true, + value: data.vue && data.vue.css && data.vue.css.extract, + message: 'vue-webpack.config.vue-cli.css.extract.label', + description: 'vue-webpack.config.vue-cli.css.extract.description', + group: 'vue-webpack.config.vue-cli.groups.css', + link: 'https://cli.vuejs.org/config/#css-extract' + }, + { + name: 'css.sourceMap', + type: 'confirm', + default: false, + value: data.vue && data.vue.css && data.vue.css.sourceMap, + message: 'vue-webpack.config.vue-cli.css.sourceMap.label', + description: 'vue-webpack.config.vue-cli.css.sourceMap.description', + group: 'vue-webpack.config.vue-cli.groups.css', + link: 'https://cli.vuejs.org/config/#css-sourcemap' + } + ] + }), + onWrite: async ({ api, prompts }) => { + const vueData = {} + for (const prompt of prompts) { + vueData[prompt.id] = await api.getAnswer(prompt.id) + } + api.setData('vue', vueData) + } + }) +} diff --git a/packages/@vue/cli-ui/ui-defaults/index.js b/packages/@vue/cli-ui/ui-defaults/index.js index 9103c285bf..a68f8189aa 100644 --- a/packages/@vue/cli-ui/ui-defaults/index.js +++ b/packages/@vue/cli-ui/ui-defaults/index.js @@ -1,4 +1,5 @@ module.exports = api => { require('./tasks')(api) require('./suggestions')(api) + require('./config')(api) } diff --git a/packages/@vue/cli-ui/ui-defaults/suggestions.js b/packages/@vue/cli-ui/ui-defaults/suggestions.js index 3de2b49a69..4e7ccbdca5 100644 --- a/packages/@vue/cli-ui/ui-defaults/suggestions.js +++ b/packages/@vue/cli-ui/ui-defaults/suggestions.js @@ -3,6 +3,7 @@ const invoke = require('@vue/cli/lib/invoke') const ROUTER = 'vue-router-add' const VUEX = 'vuex-add' +const VUE_CONFIG_OPEN = 'vue-config-open' module.exports = api => { api.onViewOpen(({ view }) => { @@ -35,6 +36,33 @@ module.exports = api => { } else { [ROUTER, VUEX].forEach(id => api.removeSuggestion(id)) } + + if (view.id !== 'vue-project-configurations') { + api.removeSuggestion(VUE_CONFIG_OPEN) + } + }) + + api.onConfigRead(({ config }) => { + if (config.id === 'vue-cli') { + if (config.foundFiles.vue) { + api.addSuggestion({ + id: VUE_CONFIG_OPEN, + type: 'action', + label: 'vue-webpack.suggestions.vue-config-open', + handler () { + const file = config.foundFiles.vue.path + console.log('open', file) + const launch = require('launch-editor') + launch(file) + return { + keep: true + } + } + }) + return + } + } + api.removeSuggestion(VUE_CONFIG_OPEN) }) } diff --git a/packages/@vue/cli-ui/ui-public/vue-cli.png b/packages/@vue/cli-ui/ui-public/vue-cli.png new file mode 100644 index 0000000000..9e0ea5e504 Binary files /dev/null and b/packages/@vue/cli-ui/ui-public/vue-cli.png differ