Docs/153 deprecated features in migration

src/.vuepress/config.js

@@ -87,12 +87,13 @@ const sidebar = {
       title: 'Migration to Vue 3',
       collapsable: true,
       children: [
-        'migration',
+        'migration/introduction',
         'migration/global-api',
         'migration/treeshaking',
         'migration/functional-components',
         'migration/async-components',
-        'migration/custom-directives'
+        'migration/custom-directives',
+        'migration/keycode-modifiers'
       ]
     },
     {

src/guide/migration.md → src/guide/migration/introduction.md

@@ -1,4 +1,4 @@
-# Migration
+# Introduction
 
 > There's so much here! Does that mean 3.0 is completely different, I'll have to learn the basics all over again, and migrating will be practically impossible?
 
@@ -38,6 +38,14 @@ It depends on a few factors:
 
 [//]: # 'TODO: still need to see where this lands'
 
+## Overview
+
+### Deprecated
+
+The following features are now deprecated from v2:
+
+- **keyCode support as `v-on` modifiers.** For more information, [see in-depth explanation](/guides/migration/keycodes.html)
+
 ## Built-in Directives
 
 ### `v-model` API Change

src/guide/migration/keycode-modifiers.md

@@ -0,0 +1,51 @@
+# KeyCode Modifiers
+
+## Overview
+
+Here is a quick summary of what has changed:
+
+- **BREAKING**: Using numbers, i.e. keyCodes, as `v-on` modifiers are no longer supported
+- **BREAKING**: `config.keyCodes` is no longer supported
+
+## Previous Syntax
+
+In Vue 2, keyCodes were supported as a way to modify a `v-on` method.
+
+```html
+<!-- keyCode version -->
+<input v-on:keyup.13="submit" />
+
+<!-- alias version -->
+<input v-on:keyup.enter="submit" />
+```
+
+In addition, you could define your own aliases via the global `config.keyCodes` option.
+
+```js
+Vue.config.keyCodes = {
+  f1: 112
+}
+```
+
+```html
+<!-- keyCode version -->
+<input v-on:keyup.112="showHelpText" />
+
+<!-- custom alias version -->
+<input v-on:keyup.f1="showHelpText" />
+```
+
+## Current Syntax
+
+Since [`KeyboardEvent.keyCode` has been deprecated](https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/keyCode), it no longer makes sense for Vue 3 to continue supporting this as well. As a result, it is now recommended to use the kebab-case name for any key you want to use as a modifier.
+
+```html
+<!-- Vue 3 Key Modifier on v-on -->
+<input v-on:keyup.delete="confirmDelete" />
+```
+
+As a result, this means that `config.keyCodes` is now also deprecated and will no longer be supported.
+
+## How to Migrate
+
+For those using `keyCode` in their codbase, we recommend converting them to their kebab-cased named equivalents.