feat: --skip-plugins (#4448)

Allow skipping of plugins  from command line

close #4262
close #3830

docs/guide/cli-service.md

@@ -44,12 +44,14 @@ Usage: vue-cli-service serve [options] [entry]
 
 Options:
 
-  --open    open browser on server start
-  --copy    copy url to clipboard on server start
-  --mode    specify env mode (default: development)
-  --host    specify host (default: 0.0.0.0)
-  --port    specify port (default: 8080)
-  --https   use https (default: false)
+  --open         open browser on server start
+  --copy         copy url to clipboard on server start
+  --mode         specify env mode (default: development)
+  --host         specify host (default: 0.0.0.0)
+  --port         specify port (default: 8080)
+  --https        use https (default: false)
+  --public       specify the public network URL for the HMR client
+  --skip-plugins comma-separated list of plugin names to skip for this run
 ```
 
 ::: tip --copy
@@ -70,17 +72,20 @@ Usage: vue-cli-service build [options] [entry|pattern]
 
 Options:
 
-  --mode        specify env mode (default: production)
-  --dest        specify output directory (default: dist)
-  --modern      build app targeting modern browsers with auto fallback
-  --target      app | lib | wc | wc-async (default: app)
-  --formats     list of output formats for library builds (default: commonjs,umd,umd-min)
+  --mode         specify env mode (default: production)
+  --dest         specify output directory (default: dist)
+  --modern       build app targeting modern browsers with auto fallback
+  --no-unsafe-inline build app without introducing inline scripts
+  --target       app | lib | wc | wc-async (default: app)
+  --formats      list of output formats for library builds (default: commonjs,umd,umd-min)
   --inline-vue  include the Vue module in the final bundle of library or web component target
-  --name        name for lib or web-component mode (default: "name" in package.json or entry filename)
-  --no-clean    do not remove the dist directory before building the project
-  --report      generate report.html to help analyze bundle content
-  --report-json generate report.json to help analyze bundle content
-  --watch       watch for changes
+  --name         name for lib or web-component mode (default: "name" in package.json or entry filename)
+  --filename     file name for output, only usable for 'lib' target (default: value of --name),
+  --no-clean     do not remove the dist directory before building the project
+  --report       generate report.html to help analyze bundle content
+  --report-json  generate report.json to help analyze bundle content
+  --skip-plugins comma-separated list of plugin names to skip for this run
+  --watch        watch for changes
 ```
 
 `vue-cli-service build` produces a production-ready bundle in the `dist/` directory, with minification for JS/CSS/HTML and auto vendor chunk splitting for better caching. The chunk manifest is inlined into the HTML.
@@ -119,6 +124,35 @@ You can also learn about the available options of each command with:
 npx vue-cli-service help [command]
 ```
 
+## Skipping Plugins
+
+Sometimes, you may want to not use a certain CLI Plugin when running a command. For example you might want to build a version of your app that doesn't include the PWA plugin. You can do that by passing the name of the plugin to the `--skip-plugins` option.
+
+```bash
+npx vue-cli-service build --skip-plugins pwa
+```
+
+::: tip
+This option is available for _every_ `vue-cli-service` command, including custom ones added by other plugins.
+:::
+
+You can skip multiple plugins by passing their names as a comma-separated list:
+
+```bash
+npx vue-cli-service build --skip-plugins pwa,apollo
+```
+
+Plugin names are resolved the same way they are during install, as described [here](./plugins-and-presets.md#installing-plugins-in-an-existing-project)
+
+``` bash
+# these are all equivalent
+npx vue-cli-service build --skip-plugins pwa
+
+npx vue-cli-service build --skip-plugins @vue/pwa
+
+npx vue-cli-service build --skip-plugins @vue/cli-plugin-pwa
+```
+
 ## Caching and Parallelization
 
 - `cache-loader` is enabled for Vue/Babel/TypeScript compilations by default. Files are cached inside `node_modules/.cache` - if running into compilation issues, always try deleting the cache directory first.

packages/@vue/cli-service/__tests__/Service.spec.js

@@ -175,6 +175,27 @@ test('api: registerCommand', () => {
   expect(args).toEqual({ _: [], n: 1 })
 })
 
+test('api: --skip-plugins', () => {
+  let untouched = true
+  const service = createMockService([{
+    id: 'test-command',
+    apply: api => {
+      api.registerCommand('foo', _args => {
+        return
+      })
+    }
+  },
+  {
+    id: 'vue-cli-plugin-test-plugin',
+    apply: api => {
+      untouched = false
+    }
+  }], false)
+
+  service.run('foo', { 'skip-plugins': 'test-plugin' })
+  expect(untouched).toEqual(true)
+})
+
 test('api: defaultModes', () => {
   fs.writeFileSync('/.env.foo', `FOO=5\nBAR=6`)
   fs.writeFileSync('/.env.foo.local', `FOO=7\nBAZ=8`)

packages/@vue/cli-service/lib/Service.js

@@ -9,7 +9,7 @@ const PluginAPI = require('./PluginAPI')
 const dotenv = require('dotenv')
 const dotenvExpand = require('dotenv-expand')
 const defaultsDeep = require('lodash.defaultsdeep')
-const { warn, error, isPlugin, loadModule } = require('@vue/cli-shared-utils')
+const { warn, error, isPlugin, resolvePluginId, loadModule } = require('@vue/cli-shared-utils')
 
 const { defaults, validate } = require('./options')
 
@@ -32,6 +32,8 @@ module.exports = class Service {
     // When useBuiltIn === false, built-in plugins are disabled. This is mostly
     // for testing.
     this.plugins = this.resolvePlugins(plugins, useBuiltIn)
+    // pluginsToSkip will be populated during run()
+    this.pluginsToSkip = new Set()
     // resolve the default mode to use for each command
     // this is provided by plugins as module.exports.defaultModes
     // so we can get the information without actually applying the plugin.
@@ -77,6 +79,7 @@ module.exports = class Service {
 
     // apply plugins.
     this.plugins.forEach(({ id, apply }) => {
+      if (this.pluginsToSkip.has(id)) return
       apply(new PluginAPI(id, this), this.projectOptions)
     })
 
@@ -132,6 +135,15 @@ module.exports = class Service {
     }
   }
 
+  setPluginsToSkip (args) {
+    const skipPlugins = args['skip-plugins']
+    const pluginsToSkip = skipPlugins
+      ? new Set(skipPlugins.split(',').map(id => resolvePluginId(id)))
+      : new Set()
+
+    this.pluginsToSkip = pluginsToSkip
+  }
+
   resolvePlugins (inlinePlugins, useBuiltIn) {
     const idToPlugin = id => ({
       id: id.replace(/^.\//, 'built-in:'),
@@ -201,6 +213,9 @@ module.exports = class Service {
     // fallback to resolved default modes from plugins or development if --watch is defined
     const mode = args.mode || (name === 'build' && args.watch ? 'development' : this.modes[name])
 
+    // --skip-plugins arg may have plugins that should be skipped during init()
+    this.setPluginsToSkip(args)
+
     // load env variables, load user config, apply plugins
     this.init(mode)
 
@@ -346,7 +361,6 @@ module.exports = class Service {
       resolvedFrom = 'inline options'
     }
 
-
     if (resolved.css && typeof resolved.css.modules !== 'undefined') {
       if (typeof resolved.css.requireModuleExtension !== 'undefined') {
         warn(

packages/@vue/cli-service/lib/commands/build/index.js

@@ -36,6 +36,7 @@ module.exports = (api, options) => {
       '--no-clean': `do not remove the dist directory before building the project`,
       '--report': `generate report.html to help analyze bundle content`,
       '--report-json': 'generate report.json to help analyze bundle content',
+      '--skip-plugins': `comma-separated list of plugin names to skip for this run`,
       '--watch': `watch for changes`
     }
   }, async (args, rawArgs) => {

packages/@vue/cli-service/lib/commands/inspect.js

@@ -10,7 +10,8 @@ module.exports = (api, options) => {
         '--plugin <pluginName>': 'inspect a specific plugin',
         '--rules': 'list all module rule names',
         '--plugins': 'list all plugin names',
-        '--verbose': 'show full function definitions in output'
+        '--verbose': 'show full function definitions in output',
+        '--skip-plugins': 'comma-separated list of plugin names to skip for this run'
       }
     },
     args => {

packages/@vue/cli-service/lib/commands/serve.js

@@ -23,7 +23,8 @@ module.exports = (api, options) => {
       '--host': `specify host (default: ${defaults.host})`,
       '--port': `specify port (default: ${defaults.port})`,
       '--https': `use https (default: ${defaults.https})`,
-      '--public': `specify the public network URL for the HMR client`
+      '--public': `specify the public network URL for the HMR client`,
+      '--skip-plugins': `comma-separated list of plugin names to skip for this run`
     }
   }, async function serve (args) {
     info('Starting development server...')