Skip to content

Commit

Permalink
fix: should not add polyfills from transform-runtime plugin (#3730)
Browse files Browse the repository at this point in the history
It is due to a misunderstanding when upgrading babel from 7.0.0-beta.47
to 7.x.
In Vue CLI, usage-based polyfills are **only** added by @babel/preset-env
so that it avoids overheads. `transform-runtime` plugin adds polyfills
regardless of env targets so we must disable its polyfill feature.
Though, there're edge cases where runtime-helpers' polyfill dependency
are not correctly added (babel/babel#7597),
so we also need to whitelist `@babel/runtime` for webpack to transpile.
  • Loading branch information
sodatea committed Mar 31, 2019
1 parent eeb350e commit b987969
Show file tree
Hide file tree
Showing 4 changed files with 14 additions and 10 deletions.
10 changes: 5 additions & 5 deletions packages/@vue/babel-preset-app/__tests__/babel-preset.spec.js
Expand Up @@ -45,7 +45,7 @@ test('polyfill detection', () => {
// promise polyfill alone doesn't work in IE, needs this as well. fix: #1642
expect(code).toMatch(genCoreJSImportRegExp('es6.array.iterator'))
// usage-based detection
expect(code).toMatch(/import _Map from ".*runtime-corejs2\/core-js\/map"/)
expect(code).toMatch(/import "core-js\/modules\/es6.map"/)
})

test('modern mode always skips polyfills', () => {
Expand All @@ -63,7 +63,7 @@ test('modern mode always skips polyfills', () => {
// default includes
expect(code).not.toMatch(genCoreJSImportRegExp('es6.promise'))
// usage-based detection
expect(code).not.toMatch(/import _Map from ".*runtime-corejs2\/core-js\/map"/)
expect(code).not.toMatch(/import "core-js\/modules\/es6.map"/)

;({ code } = babel.transformSync(`
const a = new Map()
Expand All @@ -78,7 +78,7 @@ test('modern mode always skips polyfills', () => {
// default includes
expect(code).not.toMatch(genCoreJSImportRegExp('es6.promise'))
// usage-based detection
expect(code).not.toMatch(/import _Map from ".*runtime-corejs2\/core-js\/map"/)
expect(code).not.toMatch(/import "core-js\/modules\/es6.map"/)
delete process.env.VUE_CLI_MODERN_BUILD
})

Expand Down Expand Up @@ -107,7 +107,7 @@ test('async/await', () => {
// 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\/helpers\/esm\/asyncToGenerator\"/)
})

test('jsx', () => {
Expand Down Expand Up @@ -152,5 +152,5 @@ test('disable absoluteRuntime', () => {
filename: 'test-entry-file.js'
})

expect(code).toMatch('import _toConsumableArray from "@babel/runtime-corejs2/helpers/esm/toConsumableArray"')
expect(code).toMatch('import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray"')
})
8 changes: 4 additions & 4 deletions packages/@vue/babel-preset-app/index.js
Expand Up @@ -151,10 +151,10 @@ module.exports = (context, options = {}) => {
// transform runtime, but only for helpers
plugins.push([require('@babel/plugin-transform-runtime'), {
regenerator: useBuiltIns !== 'usage',
// use @babel/runtime-corejs2 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 2 is no longer needed.
corejs: (useBuiltIns === 'usage' && !process.env.VUE_CLI_MODERN_BUILD) ? 2 : false,

// polyfills are injected by preset-env & polyfillsPlugin, so no need to add them again
corejs: false,

helpers: useBuiltIns === 'usage',
useESModules: !process.env.VUE_CLI_BABEL_TRANSPILE_MODULES,

Expand Down
1 change: 0 additions & 1 deletion packages/@vue/babel-preset-app/package.json
Expand Up @@ -30,7 +30,6 @@
"@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",
"@vue/babel-preset-jsx": "^1.0.0-beta.2",
"babel-plugin-dynamic-import-node": "^2.2.0",
"core-js": "^2.6.5"
Expand Down
5 changes: 5 additions & 0 deletions packages/@vue/cli-plugin-babel/index.js
Expand Up @@ -40,6 +40,11 @@ module.exports = (api, options) => {
if (transpileDepRegex && transpileDepRegex.test(filepath)) {
return false
}
// may need to add polyfills (by preset-env) for babel helpers
// https://github.com/babel/babel/issues/7597
if (/node_modules\/@babel\/runtime/.test(filepath)) {
return false
}
// Don't transpile node_modules
return /node_modules/.test(filepath)
})
Expand Down

0 comments on commit b987969

Please sign in to comment.