chore: update readme [ci skip]

This commit is contained in:
Evan You 2020-09-18 01:25:53 -04:00
parent a8d27cc058
commit 44e1237d1f

View File

@ -1,88 +1,96 @@
# vue-next [![beta](https://img.shields.io/npm/v/vue/next.svg)](https://www.npmjs.com/package/vue/v/next) [![CircleCI](https://circleci.com/gh/vuejs/vue-next.svg?style=svg&circle-token=fb883a2d0a73df46e80b2e79fd430959d8f2b488)](https://circleci.com/gh/vuejs/vue-next)
## Status: Release Candidate
This is the repository for Vue 3.0.
- All planned RFCs have been merged.
## Quickstart
- All [merged RFCs](https://github.com/vuejs/rfcs/pulls?q=is%3Apr+is%3Amerged+label%3A3.x) have been implemented.
- Via CDN: `<script src="https://unpkg.com/vue@next"></script>`
- In-browser playground on [Codepen](https://codepen.io/yyx990803/pen/OJNoaZL)
- Scaffold via [Vite](https://github.com/vitejs/vite):
- Vue CLI now has experimental support via [vue-cli-plugin-vue-next](https://github.com/vuejs/vue-cli-plugin-vue-next).
```bash
npm init vite-app hello-vue3 # OR yarn create vite-app hello-vue3
```
- There is also a simple plain webpack-based setup with Single-File Component support available [here](https://github.com/vuejs/vue-next-webpack-preview).
- Scaffold via [vue-cli](https://cli.vuejs.org/):
Please note that there could still be undocumented behavior inconsistencies with 2.x. When you run into such a case, please make sure to first check if the behavior difference has already been proposed in an existing RFC. If the inconsistency is not part of an RFC, then it's likely unintended, and an issue should be opened (please make sure to use the [issue helper](https://new-issue.vuejs.org/?repo=vuejs/vue-next) when opening new issues).
```bash
npm install -g @vue/cli # OR yarn global add @vue/cli
vue create hello-vue3
# select vue 3 preset
```
In addition, the current implementation requires native ES2015+ in the runtime environment and does not support IE11 (yet). The IE11 compatible build will be worked on after we have reached RC stage.
## Changes from Vue 2
The documentation of Vue 3 can be found at https://v3.vuejs.org/
Please consult the [Migration Guide](https://v3.vuejs.org/guide/migration/introduction.html).
## Status of the rest of the framework
- Note: IE11 support is still pending.
## Supporting Libraries
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 by end of 2020.**
### Vue CLI
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.
### Vue Router
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.
- [![beta](https://img.shields.io/npm/v/vue-router/next.svg)](https://www.npmjs.com/package/vue-router/v/next)
- [Github](https://github.com/vuejs/vue-router-next)
- [RFCs](https://github.com/vuejs/rfcs/pulls?q=is%3Apr+is%3Amerged+label%3Arouter)
### Vuex
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).
- [![beta](https://img.shields.io/npm/v/vuex/next.svg)](https://www.npmjs.com/package/vuex/v/next)
- [Github](https://github.com/vuejs/vuex/tree/4.0)
The only difference between Vuex 4.0 and 3.x is that it's Vue 3 compatible! It is ready to enter RC together with Vue 3 core.
### Devtools Extension
### Vue CLI
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.
As of v4.5.0, `vue-cli` now provides built-in option to choose Vue 3 preset when creating a new project.
- For Chrome: [Install from Chrome web store](https://chrome.google.com/webstore/detail/vuejs-devtools/ljjemllljcmogpfapbkkighbhhppjdbg?hl=en)
### JSX Support
- 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.
There are currently two JSX transform implementations for Vue 3 with slightly differing syntax (for Vue specific features):
- [vuejs/jsx-next](https://github.com/vuejs/jsx-next)
- [HcySunYang/vue-next-jsx](https://github.com/HcySunYang/vue-next-jsx)
We are using [this thread](https://github.com/vuejs/jsx/issues/141) to unify the design and land on an official specification of how Vue features should be handled in JSX. If you use Vue with JSX, please provide your feedback in that thread.
- For Firefox: [Download the signed extension](https://github.com/vuejs/vue-devtools/releases/tag/v6.0.0-beta.2) (`.xpi` file under Assets)
### Other Projects
| Project | Status |
| ------------------- | ------ |
| vue-devtools | [![alpha][vd-badge]][vd-npm] [[Github][vd-code]] |
| eslint-plugin-vue | [![alpha][epv-badge]][epv-npm] [[Github][epv-code]] |
| @vue/test-utils | [![alpha][vtu-badge]][vtu-npm] [[Github][vtu-code]] |
| vue-class-component | [![alpha][vcc-badge]][vcc-npm] [[Github][vcc-code]] |
| vue-loader | [![alpha][vl-badge]][vl-npm] [[Github][vl-code]] |
| rollup-plugin-vue | [![alpha][rpv-badge]][rpv-npm] [[Github][rpv-code]] |
| Project | NPM | Repo |
| --------------------- | ----------------------------- | -------------------- |
| @vue/babel-plugin-jsx | [![rc][jsx-badge]][jsx-npm] | [[Github][jsx-code]] |
| eslint-plugin-vue | [![beta][epv-badge]][epv-npm] | [[Github][epv-code]] |
| @vue/test-utils | [![beta][vtu-badge]][vtu-npm] | [[Github][vtu-code]] |
| vue-class-component | [![beta][vcc-badge]][vcc-npm] | [[Github][vcc-code]] |
| vue-loader | [![beta][vl-badge]][vl-npm] | [[Github][vl-code]] |
| rollup-plugin-vue | [![beta][rpv-badge]][rpv-npm] | [[Github][rpv-code]] |
[jsx-badge]: https://img.shields.io/npm/v/@vue/babel-plugin-jsx.svg
[jsx-npm]: https://www.npmjs.com/package/@vue/babel-plugin-jsx
[jsx-code]: https://github.com/vuejs/jsx-next
[vd-badge]: https://img.shields.io/npm/v/@vue/devtools/beta.svg
[vd-npm]: https://www.npmjs.com/package/@vue/devtools/v/beta
[vd-code]: https://github.com/vuejs/vue-devtools/tree/next
[epv-badge]: https://img.shields.io/npm/v/eslint-plugin-vue/next.svg
[epv-npm]: https://www.npmjs.com/package/eslint-plugin-vue/v/next
[epv-code]: https://github.com/vuejs/eslint-plugin-vue
[vtu-badge]: https://img.shields.io/npm/v/@vue/test-utils/next.svg
[vtu-npm]: https://www.npmjs.com/package/@vue/test-utils/v/next
[vtu-code]: https://github.com/vuejs/vue-test-utils-next
[jsx-badge]: https://img.shields.io/npm/v/@ant-design-vue/babel-plugin-jsx.svg
[jsx-npm]: https://www.npmjs.com/package/@ant-design-vue/babel-plugin-jsx
[jsx-code]: https://github.com/vueComponent/jsx
[vcc-badge]: https://img.shields.io/npm/v/vue-class-component/next.svg
[vcc-npm]: https://www.npmjs.com/package/vue-class-component/v/next
[vcc-code]: https://github.com/vuejs/vue-class-component/tree/next
[vl-badge]: https://img.shields.io/npm/v/vue-loader/next.svg
[vl-npm]: https://www.npmjs.com/package/vue-loader/v/next
[vl-code]: https://github.com/vuejs/vue-loader/tree/next
[rpv-badge]: https://img.shields.io/npm/v/rollup-plugin-vue/next.svg
[rpv-npm]: https://www.npmjs.com/package/rollup-plugin-vue/v/next
[rpv-code]: https://github.com/vuejs/rollup-plugin-vue/tree/next
## Contribution
See [Contributing Guide](https://github.com/vuejs/vue-next/blob/master/.github/contributing.md).