|
1 |
| -# vue-next [](https://www.npmjs.com/package/vue/v/next) [](https://github.com/vuejs/vue-next/actions/workflows/ci.yml) |
| 1 | +# vuejs/core [](https://www.npmjs.com/package/vue/v/next) [](https://github.com/vuejs/core/actions/workflows/ci.yml) |
2 | 2 |
|
3 |
| -This is the repository for Vue 3.0. |
| 3 | +This is the repository for Vue 3.x. |
4 | 4 |
|
5 | 5 | ## Quickstart
|
6 | 6 |
|
7 | 7 | - Via CDN: `<script src="https://unpkg.com/vue@next"></script>`
|
8 |
| -- In-browser playground on [Codepen](https://codepen.io/yyx990803/pen/OJNoaZL) |
9 |
| -- Scaffold via [Vite](https://github.com/vitejs/vite): |
| 8 | +- Try in the browser on [StackBlitz](https://vite.new/vue) |
| 9 | +- Scaffold via [create-vue](https://github.com/vuejs/create-vue): |
10 | 10 |
|
11 | 11 | ```bash
|
12 |
| - # npm 6.x |
13 |
| - npm init vite@latest my-vue-app --template vue |
14 |
| - # npm 7+, extra double-dash is needed: |
15 |
| - npm init vite@latest my-vue-app -- --template vue |
| 12 | + # npm |
| 13 | + npm init vue@latest |
16 | 14 | # yarn
|
17 |
| - yarn create vite my-vue-app --template vue |
18 |
| - ``` |
19 |
| - |
20 |
| -- Scaffold via [vue-cli](https://cli.vuejs.org/): |
21 |
| - |
22 |
| - ```bash |
23 |
| - npm install -g @vue/cli # OR yarn global add @vue/cli |
24 |
| - vue create hello-vue3 |
25 |
| - # select vue 3 preset |
| 15 | + yarn create vue |
26 | 16 | ```
|
27 | 17 |
|
28 | 18 | ## Changes from Vue 2
|
29 | 19 |
|
30 |
| -Please consult the [Migration Guide](https://v3.vuejs.org/guide/migration/introduction.html). |
| 20 | +Please consult the [Migration Guide](http://v3-migration.vuejs.org/). |
31 | 21 |
|
32 | 22 | Also note: Vue 3 does not support IE11 ([RFC](https://github.com/vuejs/rfcs/blob/master/active-rfcs/0038-vue3-ie11-support.md) | [Discussion](https://github.com/vuejs/rfcs/discussions/296)).
|
33 |
| - |
34 |
| -## Supporting Libraries |
35 |
| - |
36 |
| -All of our official libraries and tools now support Vue 3, but most of them are still in beta status and distributed under the `next` dist tag on NPM. **We are planning to stabilize and switch all projects to use the `latest` dist tag in early 2021.** |
37 |
| - |
38 |
| -### Vue CLI |
39 |
| - |
40 |
| -As of v4.5.0, `vue-cli` now provides built-in option to choose Vue 3 preset when creating a new project. You can upgrade `vue-cli` and run `vue create` to create a Vue 3 project today. |
41 |
| - |
42 |
| -### Vue Router |
43 |
| - |
44 |
| -Vue Router 4.0 provides Vue 3 support and has a number of breaking changes of its own. Check out its [Migration Guide](https://next.router.vuejs.org/guide/migration/) for full details. |
45 |
| - |
46 |
| -- [](https://www.npmjs.com/package/vue-router/v/next) |
47 |
| -- [GitHub](https://github.com/vuejs/vue-router-next) |
48 |
| -- [RFCs](https://github.com/vuejs/rfcs/pulls?q=is%3Apr+is%3Amerged+label%3Arouter) |
49 |
| - |
50 |
| -### Vuex |
51 |
| - |
52 |
| -Vuex 4.0 provides Vue 3 support with largely the same API as 3.x. The only breaking change is [how the plugin is installed](https://github.com/vuejs/vuex/tree/4.0#breaking-changes). |
53 |
| - |
54 |
| -- [](https://www.npmjs.com/package/vuex/v/next) |
55 |
| -- [GitHub](https://github.com/vuejs/vuex/tree/4.0) |
56 |
| - |
57 |
| -### Devtools Extension |
58 |
| - |
59 |
| -We are working on a new version of the Devtools with a new UI and refactored internals to support multiple Vue versions. The new version is currently in beta and only supports Vue 3 (for now). Vuex and Router integration is also work in progress. |
60 |
| - |
61 |
| -- For Chrome: [Install from Chrome web store](https://chrome.google.com/webstore/detail/vuejs-devtools/ljjemllljcmogpfapbkkighbhhppjdbg?hl=en) |
62 |
| - |
63 |
| - - Note: the beta channel may conflict with the stable version of devtools so you may need to temporarily disable the stable version for the beta channel to work properly. |
64 |
| - |
65 |
| -- For Firefox: [Download the signed extension](https://github.com/vuejs/vue-devtools/releases/tag/v6.0.0-beta.2) (`.xpi` file under Assets) |
66 |
| - |
67 |
| -### IDE Support |
68 |
| - |
69 |
| -It is recommended to use [VSCode](https://code.visualstudio.com/). There are currently two viable extensions for Single-File Components (SFCs) support: |
70 |
| - |
71 |
| -- [Vetur](https://marketplace.visualstudio.com/items?itemName=octref.vetur) (recommended if you are used to Vetur features) |
72 |
| -- [Volar](https://marketplace.visualstudio.com/items?itemName=johnsoncodehk.volar) (recommended if using TypeScript with SFCs, or `<script setup>` syntax) |
73 |
| - |
74 |
| -### TypeScript Support |
75 |
| - |
76 |
| -- All Vue 3 packages ship with types. |
77 |
| -- [vue-tsc](https://github.com/johnsoncodehk/volar/tree/master/packages/vue-tsc) perform TypeScript type checks / diagnostics on Vue SFCs via the command line, generate TypeScript definitions from Vue SFCs. |
78 |
| - |
79 |
| -### Other Projects |
80 |
| - |
81 |
| -| Project | NPM | Repo | |
82 |
| -| --------------------- | ------------------------------- | -------------------- | |
83 |
| -| @vue/babel-plugin-jsx | [![rc][jsx-badge]][jsx-npm] | [[GitHub][jsx-code]] | |
84 |
| -| eslint-plugin-vue | [![stable][epv-badge]][epv-npm] | [[GitHub][epv-code]] | |
85 |
| -| @vue/test-utils | [![beta][vtu-badge]][vtu-npm] | [[GitHub][vtu-code]] | |
86 |
| -| vue-class-component | [![beta][vcc-badge]][vcc-npm] | [[GitHub][vcc-code]] | |
87 |
| -| vue-loader | [![beta][vl-badge]][vl-npm] | [[GitHub][vl-code]] | |
88 |
| -| rollup-plugin-vue | [![beta][rpv-badge]][rpv-npm] | [[GitHub][rpv-code]] | |
89 |
| - |
90 |
| -[jsx-badge]: https://img.shields.io/npm/v/@vue/babel-plugin-jsx.svg |
91 |
| -[jsx-npm]: https://www.npmjs.com/package/@vue/babel-plugin-jsx |
92 |
| -[jsx-code]: https://github.com/vuejs/jsx-next |
93 |
| -[vd-badge]: https://img.shields.io/npm/v/@vue/devtools/beta.svg |
94 |
| -[vd-npm]: https://www.npmjs.com/package/@vue/devtools/v/beta |
95 |
| -[vd-code]: https://github.com/vuejs/vue-devtools/tree/next |
96 |
| -[epv-badge]: https://img.shields.io/npm/v/eslint-plugin-vue.svg |
97 |
| -[epv-npm]: https://www.npmjs.com/package/eslint-plugin-vue |
98 |
| -[epv-code]: https://github.com/vuejs/eslint-plugin-vue |
99 |
| -[vtu-badge]: https://img.shields.io/npm/v/@vue/test-utils/next.svg |
100 |
| -[vtu-npm]: https://www.npmjs.com/package/@vue/test-utils/v/next |
101 |
| -[vtu-code]: https://github.com/vuejs/vue-test-utils-next |
102 |
| -[jsx-badge]: https://img.shields.io/npm/v/@ant-design-vue/babel-plugin-jsx.svg |
103 |
| -[jsx-npm]: https://www.npmjs.com/package/@ant-design-vue/babel-plugin-jsx |
104 |
| -[jsx-code]: https://github.com/vueComponent/jsx |
105 |
| -[vcc-badge]: https://img.shields.io/npm/v/vue-class-component/next.svg |
106 |
| -[vcc-npm]: https://www.npmjs.com/package/vue-class-component/v/next |
107 |
| -[vcc-code]: https://github.com/vuejs/vue-class-component/tree/next |
108 |
| -[vl-badge]: https://img.shields.io/npm/v/vue-loader/next.svg |
109 |
| -[vl-npm]: https://www.npmjs.com/package/vue-loader/v/next |
110 |
| -[vl-code]: https://github.com/vuejs/vue-loader/tree/next |
111 |
| -[rpv-badge]: https://img.shields.io/npm/v/rollup-plugin-vue/next.svg |
112 |
| -[rpv-npm]: https://www.npmjs.com/package/rollup-plugin-vue/v/next |
113 |
| -[rpv-code]: https://github.com/vuejs/rollup-plugin-vue/tree/next |
0 commit comments