Merge pull request #1 from vuejs/master

Pull the latest

Author: yinfoyuan

.circleci/config.yml

@@ -41,7 +41,7 @@ module.exports = {
     },
     // Packages targeting DOM
     {
-      files: ['packages/{vue,runtime-dom}/**'],
+      files: ['packages/{vue,vue-compat,runtime-dom}/**'],
       rules: {
         'no-restricted-globals': ['error', ...NodeGlobals]
       }
@@ -56,7 +56,7 @@ module.exports = {
     },
     // Private package, browser only + no syntax restrictions
     {
-      files: ['packages/template-explorer/**'],
+      files: ['packages/template-explorer/**', 'packages/sfc-playground/**'],
       rules: {
         'no-restricted-globals': ['error', ...NodeGlobals],
         'no-restricted-syntax': 'off'

.eslintrc.js

@@ -0,0 +1,64 @@
+version: 2
+updates:
+- package-ecosystem: npm
+  directory: "/"
+  schedule:
+    interval: monthly
+  open-pull-requests-limit: 10
+  versioning-strategy: lockfile-only
+  ignore:
+  - dependency-name: "@types/node"
+    versions:
+    - 14.14.24
+    - 14.14.37
+  - dependency-name: "@babel/parser"
+    versions:
+    - 7.12.11
+    - 7.12.13
+    - 7.12.14
+    - 7.12.15
+    - 7.12.16
+    - 7.12.17
+    - 7.13.0
+    - 7.13.10
+    - 7.13.11
+    - 7.13.13
+    - 7.13.4
+    - 7.13.9
+  - dependency-name: eslint
+    versions:
+    - 7.23.0
+  - dependency-name: postcss
+    versions:
+    - 8.2.4
+    - 8.2.5
+    - 8.2.7
+    - 8.2.8
+  - dependency-name: typescript
+    versions:
+    - 4.2.2
+  - dependency-name: "@babel/types"
+    versions:
+    - 7.12.12
+    - 7.12.13
+    - 7.12.17
+    - 7.13.0
+  - dependency-name: pug-code-gen
+    versions:
+    - 2.0.3
+  - dependency-name: estree-walker
+    versions:
+    - 2.0.2
+  - dependency-name: "@typescript-eslint/parser"
+    versions:
+    - 4.14.2
+    - 4.15.0
+  - dependency-name: "@microsoft/api-extractor"
+    versions:
+    - 7.13.1
+  - dependency-name: rollup
+    versions:
+    - 2.38.5
+  - dependency-name: node-notifier
+    versions:
+    - 8.0.1

.github/dependabot.yml

@@ -1,12 +1,28 @@
-name: 'size'
+name: 'ci'
 on:
   push:
     branches:
-      - master
+      - '**'
   pull_request:
     branches:
       - master
 jobs:
+  test:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v1
+      - uses: bahmutov/npm-install@v1
+      - name: Run unit tests
+        run: yarn test --ci
+
+  test-dts:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v1
+      - uses: bahmutov/npm-install@v1
+      - name: Run type declaration tests
+        run: yarn test-dts
+
   size:
     runs-on: ubuntu-latest
     env:
@@ -15,7 +31,8 @@ jobs:
       - uses: actions/checkout@v1
       - uses: bahmutov/npm-install@v1
 
-      - uses: posva/[email protected]
+      - name: Check build size
+        uses: posva/[email protected]
         with:
           github_token: ${{ secrets.GITHUB_TOKEN }}
           build_script: size

.github/workflows/size-check.yml renamed to .github/workflows/ci.yml

@@ -1,4 +1,4 @@
-# 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)
+# vue-next [![npm](https://img.shields.io/npm/v/vue/next.svg)](https://www.npmjs.com/package/vue/v/next) [![build status](https://github.com/vuejs/vue-next/actions/workflows/ci.yml/badge.svg?branch=master)](https://github.com/vuejs/vue-next/actions/workflows/ci.yml)
 
 This is the repository for Vue 3.0.
 
@@ -9,7 +9,11 @@ This is the repository for Vue 3.0.
 - Scaffold via [Vite](https://github.com/vitejs/vite):
 
   ```bash
-  npm init vite-app hello-vue3 # OR yarn create vite-app hello-vue3
+  # npm
+  npm init @vitejs/app
+  # yarn
+  yarn create @vitejs/app
+  # select vue template
   ```
 
 - Scaffold via [vue-cli](https://cli.vuejs.org/):
@@ -24,7 +28,7 @@ This is the repository for Vue 3.0.
 
 Please consult the [Migration Guide](https://v3.vuejs.org/guide/migration/introduction.html).
 
-- Note: IE11 support is still pending.
+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)).
 
 ## Supporting Libraries
 
@@ -61,18 +65,27 @@ We are working on a new version of the Devtools with a new UI and refactored int
 
 ### IDE Support
 
-It is recommended to use [VSCode](https://code.visualstudio.com/) with our official extension [Vetur](https://marketplace.visualstudio.com/items?itemName=octref.vetur), which provides comprehensive IDE support for Vue 3.
+It is recommended to use [VSCode](https://code.visualstudio.com/). There are currently two viable extensions for Single-File Components (SFCs) support:
+
+- [Vetur](https://marketplace.visualstudio.com/items?itemName=octref.vetur) (recommended if you are used to Vetur features)
+- [Volar](https://marketplace.visualstudio.com/items?itemName=johnsoncodehk.volar) (recommended if using TypeScript with SFCs, or `<script setup>` syntax)
+
+### TypeScript Support
+
+- All Vue 3 packages ship with types.
+- [vue-tsc](https://github.com/johnsoncodehk/vue-tsc) perform TypeScript type checks / diagnostics on Vue SFCs via the command line.
+- [vue-dts-gen](https://github.com/egoist/vue-dts-gen): generate TypeScript definitions from Vue SFCs.
 
 ### Other Projects
 
-| Project               | NPM                           | Repo                 |
-| --------------------- | ----------------------------- | -------------------- |
-| @vue/babel-plugin-jsx | [![rc][jsx-badge]][jsx-npm]   | [[GitHub][jsx-code]] |
+| Project               | NPM                             | Repo                 |
+| --------------------- | ------------------------------- | -------------------- |
+| @vue/babel-plugin-jsx | [![rc][jsx-badge]][jsx-npm]     | [[GitHub][jsx-code]] |
 | eslint-plugin-vue     | [![stable][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]] |
+| @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

CHANGELOG.md

@@ -12,14 +12,16 @@ module.exports = {
     __NODE_JS__: true,
     __FEATURE_OPTIONS_API__: true,
     __FEATURE_SUSPENSE__: true,
-    __FEATURE_PROD_DEVTOOLS__: false
+    __FEATURE_PROD_DEVTOOLS__: false,
+    __COMPAT__: true
   },
   coverageDirectory: 'coverage',
   coverageReporters: ['html', 'lcov', 'text'],
   collectCoverageFrom: [
     'packages/*/src/**/*.ts',
     '!packages/runtime-test/src/utils/**',
     '!packages/template-explorer/**',
+    '!packages/sfc-playground/**',
     '!packages/size-check/**',
     '!packages/runtime-core/src/profiling.ts',
     '!packages/runtime-core/src/customFormatter.ts',
@@ -28,11 +30,14 @@ module.exports = {
     // only called in browsers
     '!packages/vue/src/devCheck.ts',
     // only used as a build entry
-    '!packages/vue/src/runtime.ts'
+    '!packages/vue/src/runtime.ts',
+    // mostly just entries
+    '!packages/vue-compat/**'
   ],
   watchPathIgnorePatterns: ['/node_modules/', '/dist/', '/.git/'],
   moduleFileExtensions: ['ts', 'tsx', 'js', 'json'],
   moduleNameMapper: {
+    '@vue/compat': '<rootDir>/packages/vue-compat/src',
     '^@vue/(.*?)$': '<rootDir>/packages/$1/src',
     vue: '<rootDir>/packages/vue/src'
   },

README.md

@@ -1,6 +1,6 @@
 {
   "private": true,
-  "version": "3.0.5",
+  "version": "3.1.1",
   "workspaces": [
     "packages/*"
   ],
@@ -18,7 +18,9 @@
     "dev-compiler": "npm-run-all --parallel \"dev template-explorer\" serve",
     "serve": "serve",
     "open": "open http://localhost:5000/packages/template-explorer/local.html",
-    "preinstall": "node ./scripts/checkYarn.js"
+    "preinstall": "node ./scripts/checkYarn.js",
+    "prebuild-sfc-playground": "node scripts/build.js compiler shared -af cjs && node scripts/build.js runtime reactivity shared -af esm-bundler && node scripts/build.js vue -f esm-bundler-runtime && node scripts/build.js vue -f esm-browser-runtime && node scripts/build.js compiler-sfc -f esm-browser",
+    "build-sfc-playground": "cd packages/sfc-playground && vite build"
   },
   "types": "test-dts/index.d.ts",
   "tsd": {
@@ -42,10 +44,10 @@
   },
   "devDependencies": {
     "@babel/types": "^7.12.0",
-    "@microsoft/api-extractor": "^7.12.1",
-    "@rollup/plugin-commonjs": "^17.0.0",
+    "@microsoft/api-extractor": "^7.15.1",
+    "@rollup/plugin-commonjs": "^18.0.0",
     "@rollup/plugin-json": "^4.0.0",
-    "@rollup/plugin-node-resolve": "^11.0.0",
+    "@rollup/plugin-node-resolve": "^11.2.1",
     "@rollup/plugin-replace": "^2.3.4",
     "@types/hash-sum": "^1.0.0",
     "@types/jest": "^26.0.16",
@@ -66,15 +68,16 @@
     "npm-run-all": "^4.1.5",
     "prettier": "~1.14.0",
     "puppeteer": "^2.0.0",
-    "rollup": "^2.26.11",
+    "rollup": "~2.38.5",
     "rollup-plugin-node-builtins": "^2.1.2",
     "rollup-plugin-node-globals": "^1.4.0",
+    "rollup-plugin-polyfill-node": "^0.6.2",
     "rollup-plugin-terser": "^7.0.2",
     "rollup-plugin-typescript2": "^0.27.2",
     "semver": "^7.3.2",
     "serve": "^11.3.0",
     "ts-jest": "^26.2.0",
-    "typescript": "^4.1.3",
+    "typescript": "^4.2.2",
     "yorkie": "^2.0.0"
   }
 }

jest.config.js

@@ -66,6 +66,7 @@ return function render(_ctx, _cache) {
     const _component_Foo = _resolveComponent(\\"Foo\\")
     const _component_bar_baz = _resolveComponent(\\"bar-baz\\")
     const _component_barbaz = _resolveComponent(\\"barbaz\\")
+    const _component_Qux = _resolveComponent(\\"Qux\\", true)
     const _directive_my_dir_0 = _resolveDirective(\\"my_dir_0\\")
     const _directive_my_dir_1 = _resolveDirective(\\"my_dir_1\\")
     let _temp0, _temp1, _temp2

package.json

@@ -5,7 +5,7 @@ exports[`compiler: integration tests function mode 1`] = `
 
 return function render(_ctx, _cache) {
   with (_ctx) {
-    const { toDisplayString: _toDisplayString, createVNode: _createVNode, openBlock: _openBlock, createBlock: _createBlock, createCommentVNode: _createCommentVNode, createTextVNode: _createTextVNode, Fragment: _Fragment, renderList: _renderList } = _Vue
+    const { toDisplayString: _toDisplayString, openBlock: _openBlock, createBlock: _createBlock, createCommentVNode: _createCommentVNode, createTextVNode: _createTextVNode, Fragment: _Fragment, renderList: _renderList, createVNode: _createVNode } = _Vue
 
     return (_openBlock(), _createBlock(\\"div\\", {
       id: \\"foo\\",
@@ -16,7 +16,7 @@ return function render(_ctx, _cache) {
         ? (_openBlock(), _createBlock(\\"div\\", { key: 0 }, \\"yes\\"))
         : (_openBlock(), _createBlock(_Fragment, { key: 1 }, [
             _createTextVNode(\\"no\\")
-          ], 64 /* STABLE_FRAGMENT */)),
+          ], 2112 /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */)),
       (_openBlock(true), _createBlock(_Fragment, null, _renderList(list, (value, index) => {
         return (_openBlock(), _createBlock(\\"div\\", null, [
           _createVNode(\\"span\\", null, _toDisplayString(value + index), 1 /* TEXT */)
@@ -28,7 +28,7 @@ return function render(_ctx, _cache) {
 `;
 
 exports[`compiler: integration tests function mode w/ prefixIdentifiers: true 1`] = `
-"const { toDisplayString: _toDisplayString, createVNode: _createVNode, openBlock: _openBlock, createBlock: _createBlock, createCommentVNode: _createCommentVNode, createTextVNode: _createTextVNode, Fragment: _Fragment, renderList: _renderList } = Vue
+"const { toDisplayString: _toDisplayString, openBlock: _openBlock, createBlock: _createBlock, createCommentVNode: _createCommentVNode, createTextVNode: _createTextVNode, Fragment: _Fragment, renderList: _renderList, createVNode: _createVNode } = Vue
 
 return function render(_ctx, _cache) {
   return (_openBlock(), _createBlock(\\"div\\", {
@@ -40,7 +40,7 @@ return function render(_ctx, _cache) {
       ? (_openBlock(), _createBlock(\\"div\\", { key: 0 }, \\"yes\\"))
       : (_openBlock(), _createBlock(_Fragment, { key: 1 }, [
           _createTextVNode(\\"no\\")
-        ], 64 /* STABLE_FRAGMENT */)),
+        ], 2112 /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */)),
     (_openBlock(true), _createBlock(_Fragment, null, _renderList(_ctx.list, (value, index) => {
       return (_openBlock(), _createBlock(\\"div\\", null, [
         _createVNode(\\"span\\", null, _toDisplayString(value + index), 1 /* TEXT */)
@@ -51,7 +51,7 @@ return function render(_ctx, _cache) {
 `;
 
 exports[`compiler: integration tests module mode 1`] = `
-"import { toDisplayString as _toDisplayString, createVNode as _createVNode, openBlock as _openBlock, createBlock as _createBlock, createCommentVNode as _createCommentVNode, createTextVNode as _createTextVNode, Fragment as _Fragment, renderList as _renderList } from \\"vue\\"
+"import { toDisplayString as _toDisplayString, openBlock as _openBlock, createBlock as _createBlock, createCommentVNode as _createCommentVNode, createTextVNode as _createTextVNode, Fragment as _Fragment, renderList as _renderList, createVNode as _createVNode } from \\"vue\\"
 
 export function render(_ctx, _cache) {
   return (_openBlock(), _createBlock(\\"div\\", {
@@ -63,7 +63,7 @@ export function render(_ctx, _cache) {
       ? (_openBlock(), _createBlock(\\"div\\", { key: 0 }, \\"yes\\"))
       : (_openBlock(), _createBlock(_Fragment, { key: 1 }, [
           _createTextVNode(\\"no\\")
-        ], 64 /* STABLE_FRAGMENT */)),
+        ], 2112 /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */)),
     (_openBlock(true), _createBlock(_Fragment, null, _renderList(_ctx.list, (value, index) => {
       return (_openBlock(), _createBlock(\\"div\\", null, [
         _createVNode(\\"span\\", null, _toDisplayString(value + index), 1 /* TEXT */)