feat!: upgrade to core-js 3 (#3912)

Author: haoqunjiang

packages/@vue/babel-preset-app/__tests__/babel-preset.spec.js

@@ -7,7 +7,7 @@ const defaultOptions = {
   filename: 'test-entry-file.js'
 }
 
-const genCoreJSImportRegExp = mod => {
+const getAbsolutePolyfill = mod => {
   // expected to include a `node_modules` in the import path because we use absolute path for core-js
   return new RegExp(`import "${['.*node_modules', 'core-js', 'modules', mod].join(`[\\${path.sep}]+`)}`)
 }
@@ -27,9 +27,9 @@ test('polyfill detection', () => {
     filename: 'test-entry-file.js'
   })
   // default includes
-  expect(code).not.toMatch(genCoreJSImportRegExp('es6.promise'))
+  expect(code).not.toMatch(getAbsolutePolyfill('es.promise'))
   // usage-based detection
-  expect(code).not.toMatch(genCoreJSImportRegExp('es6.map'))
+  expect(code).not.toMatch('import "core-js/modules/es.map"')
 
   ;({ code } = babel.transformSync(`
     const a = new Map()
@@ -41,11 +41,11 @@ test('polyfill detection', () => {
     filename: 'test-entry-file.js'
   }))
   // default includes
-  expect(code).toMatch(genCoreJSImportRegExp('es6.promise'))
+  expect(code).toMatch(getAbsolutePolyfill('es.promise'))
   // promise polyfill alone doesn't work in IE, needs this as well. fix: #1642
-  expect(code).toMatch(genCoreJSImportRegExp('es6.array.iterator'))
+  expect(code).toMatch(getAbsolutePolyfill('es.array.iterator'))
   // usage-based detection
-  expect(code).toMatch(/import "core-js\/modules\/es6.map"/)
+  expect(code).toMatch('import "core-js/modules/es.map"')
 })
 
 test('modern mode always skips polyfills', () => {
@@ -61,9 +61,9 @@ test('modern mode always skips polyfills', () => {
     filename: 'test-entry-file.js'
   })
   // default includes
-  expect(code).not.toMatch(genCoreJSImportRegExp('es6.promise'))
+  expect(code).not.toMatch(getAbsolutePolyfill('es.promise'))
   // usage-based detection
-  expect(code).not.toMatch(/import "core-js\/modules\/es6.map"/)
+  expect(code).not.toMatch('import "core-js/modules/es.map"')
 
   ;({ code } = babel.transformSync(`
     const a = new Map()
@@ -76,9 +76,9 @@ test('modern mode always skips polyfills', () => {
     filename: 'test-entry-file.js'
   }))
   // default includes
-  expect(code).not.toMatch(genCoreJSImportRegExp('es6.promise'))
+  expect(code).not.toMatch(getAbsolutePolyfill('es.promise'))
   // usage-based detection
-  expect(code).not.toMatch(/import "core-js\/modules\/es6.map"/)
+  expect(code).not.toMatch('import "core-js/modules/es.map"')
   delete process.env.VUE_CLI_MODERN_BUILD
 })
 
@@ -103,11 +103,11 @@ test('async/await', () => {
     }
     hello()
   `.trim(), defaultOptions)
-  expect(code).toMatch(genCoreJSImportRegExp('es6.promise'))
+  expect(code).toMatch(getAbsolutePolyfill('es.promise'))
   // should use regenerator runtime
   expect(code).toMatch(`import "regenerator-runtime/runtime"`)
   // should use required helper instead of inline
-  expect(code).toMatch(/import _asyncToGenerator from ".*runtime-corejs2\/helpers\/esm\/asyncToGenerator\"/)
+  expect(code).toMatch(/import _asyncToGenerator from ".*runtime-corejs3\/helpers\/esm\/asyncToGenerator\"/)
 })
 
 test('jsx', () => {
@@ -152,6 +152,6 @@ test('disable absoluteRuntime', () => {
     filename: 'test-entry-file.js'
   })
 
-  expect(code).toMatch('import _toConsumableArray from "@babel/runtime-corejs2/helpers/esm/toConsumableArray"')
-  expect(code).not.toMatch(genCoreJSImportRegExp('es6.promise'))
+  expect(code).toMatch('import _toConsumableArray from "@babel/runtime-corejs3/helpers/esm/toConsumableArray"')
+  expect(code).not.toMatch(getAbsolutePolyfill('es.promise'))
 })

packages/@vue/babel-preset-app/index.js

@@ -3,19 +3,19 @@ const path = require('path')
 const defaultPolyfills = [
   // promise polyfill alone doesn't work in IE,
   // needs this as well. see: #1642
-  'es6.array.iterator',
+  'es.array.iterator',
   // this is required for webpack code splitting, vuex etc.
-  'es6.promise',
+  'es.promise',
   // this is needed for object rest spread support in templates
   // as vue-template-es2015-compiler 1.8+ compiles it to Object.assign() calls.
-  'es6.object.assign',
+  'es.object.assign',
   // #2012 es6.promise replaces native Promise in FF and causes missing finally
-  'es7.promise.finally'
+  'es.promise.finally'
 ]
 
 function getPolyfills (targets, includes, { ignoreBrowserslistConfig, configPath }) {
   const { isPluginRequired } = require('@babel/preset-env')
-  const builtInsList = require('@babel/preset-env/data/built-ins.json')
+  const builtInsList = require('core-js-compat/data')
   const getTargets = require('@babel/preset-env/lib/targets-parser').default
   const builtInTargets = getTargets(targets, {
     ignoreBrowserslistConfig,
@@ -116,6 +116,7 @@ module.exports = (context, options = {}) => {
   }
 
   const envOptions = {
+    corejs: 3,
     spec,
     loose,
     debug,
@@ -165,18 +166,18 @@ module.exports = (context, options = {}) => {
     absoluteRuntime
   }])
 
-  // use @babel/runtime-corejs2 so that helpers that need polyfillable APIs will reference core-js instead.
+  // use @babel/runtime-corejs3 so that helpers that need polyfillable APIs will reference core-js instead.
   // if useBuiltIns is not set to 'usage', then it means users would take care of the polyfills on their own,
-  // i.e., core-js is no longer needed.
+  // i.e., core-js 3 is no longer needed.
   // this extra plugin can be removed once one of the two issues resolves:
   // https://github.com/babel/babel/issues/7597
   // https://github.com/babel/babel/issues/9903
   if (useBuiltIns === 'usage' && !process.env.VUE_CLI_MODERN_BUILD) {
-    const runtimeCoreJs2Path = path.dirname(require.resolve('@babel/runtime-corejs2/package.json'))
+    const runtimeCoreJs3Path = path.dirname(require.resolve('@babel/runtime-corejs3/package.json'))
     plugins.push([require('babel-plugin-module-resolver'), {
       alias: {
-        '@babel/runtime': '@babel/runtime-corejs2',
-        [runtimePath]: runtimeCoreJs2Path
+        '@babel/runtime': '@babel/runtime-corejs3',
+        [runtimePath]: runtimeCoreJs3Path
       }
     }])
   }

packages/@vue/babel-preset-app/package.json

@@ -27,13 +27,14 @@
     "@babel/plugin-proposal-decorators": "^7.1.0",
     "@babel/plugin-syntax-dynamic-import": "^7.0.0",
     "@babel/plugin-syntax-jsx": "^7.0.0",
-    "@babel/plugin-transform-runtime": "^7.4.0",
-    "@babel/preset-env": "^7.0.0 < 7.4.0",
-    "@babel/runtime": "^7.0.0",
-    "@babel/runtime-corejs2": "^7.2.0",
+    "@babel/plugin-transform-runtime": "^7.4.3",
+    "@babel/preset-env": "^7.4.3",
+    "@babel/runtime": "^7.4.3",
+    "@babel/runtime-corejs3": "^7.4.3",
     "@vue/babel-preset-jsx": "^1.0.0-beta.3",
     "babel-plugin-dynamic-import-node": "^2.2.0",
-    "babel-plugin-module-resolver": "3.2.0",
-    "core-js": "^2.6.5"
+    "babel-plugin-module-resolver": "^3.2.0",
+    "core-js": "^3.0.1",
+    "core-js-compat": "^3.0.1"
   }
 }

packages/@vue/cli-plugin-babel/generator.js

@@ -10,7 +10,7 @@ module.exports = api => {
       presets: ['@vue/app']
     },
     dependencies: {
-      'core-js': '^2.6.5'
+      'core-js': '^3.0.1'
     }
   })
 }

packages/@vue/cli-ui-addon-webpack/package.json

@@ -22,6 +22,7 @@
     "@vue/cli-plugin-eslint": "^3.7.0",
     "@vue/cli-service": "^3.7.0",
     "@vue/eslint-config-standard": "^4.0.0",
+    "core-js": "^3.0.1",
     "eslint": "^5.16.0",
     "stylus": "^0.54.5",
     "stylus-loader": "^3.0.2",

packages/@vue/cli-ui-addon-widgets/package.json

@@ -22,6 +22,7 @@
     "@vue/cli-plugin-eslint": "^3.7.0",
     "@vue/cli-service": "^3.7.0",
     "@vue/eslint-config-standard": "^4.0.0",
+    "core-js": "^3.0.1",
     "eslint": "^5.16.0",
     "stylus": "^0.54.5",
     "stylus-loader": "^3.0.2",

packages/@vue/cli-ui/package.json

@@ -71,6 +71,7 @@
     "@vue/eslint-config-standard": "^4.0.0",
     "@vue/ui": "^0.9.1",
     "ansi_up": "^3.0.0",
+    "core-js": "^3.0.1",
     "cross-env": "^5.1.5",
     "eslint": "^5.16.0",
     "eslint-plugin-graphql": "^3.0.3",