Vue 3 CLI-如何为Object.entries添加babel polyfill [英] Vue 3 CLI - How to add babel polyfill for Object.entries
问题描述
我有一个依赖项(vue2-google-maps),这会导致我的Vue应用在较旧的浏览器中出现问题,并引发Object.entries
错误.
I have a dependency (vue2-google-maps) which is causing issues with my Vue app in older browsers, throwing an error with Object.entries
.
阅读有关polyfill的CLI CLI文档,我看到它提到了尝试将polyfill加载到babel.config.js
.
Reading the Vue CLI Docs on polyfills, I see it mention trying to load the polyfill in babel.config.js
.
我的babel.config.js
:
module.exports = {
presets: [
['@vue/app', {
polyfills: [
'es6.object'
]
}]
]
}
引发错误:
Module build failed (from ./node_modules/babel-loader/lib/index.js):
TypeError: [BABEL] /PROJECT_DIR/src/main.js: Cannot read property 'android' of undefined (While processing: "/PROJECT_DIR/node_modules/@vue/babel-preset-app/index.js")
at targetEnvironments.filter.environment (/PROJECT_DIR/node_modules/@babel/preset-env/lib/index.js:75:16)
at Array.filter (<anonymous>)
at isPluginRequired (/PROJECT_DIR/node_modules/@babel/preset-env/lib/index.js:74:56)
at includes.filter.item (/PROJECT_DIR/node_modules/@vue/babel-preset-app/index.js:23:12)
at Array.filter (<anonymous>)
at getPolyfills (/PROJECT_DIR/node_modules/@vue/babel-preset-app/index.js:22:19)
at module.exports (/PROJECT_DIR/node_modules/@vue/babel-preset-app/index.js:94:17)
at loadDescriptor (/PROJECT_DIR/node_modules/@babel/core/lib/config/full.js:163:14)
at cachedFunction (/PROJECT_DIR/node_modules/@babel/core/lib/config/caching.js:42:19)
at loadPresetDescriptor (/PROJECT_DIR/node_modules/@babel/core/lib/config/full.js:233:63)
at config.presets.map.descriptor (/PROJECT_DIR/node_modules/@babel/core/lib/config/full.js:68:19)
at Array.map (<anonymous>)
at recurseDescriptors (/PROJECT_DIR/node_modules/@babel/core/lib/config/full.js:66:38)
at loadFullConfig (/PROJECT_DIR/node_modules/@babel/core/lib/config/full.js:106:6)
at process.nextTick (/PROJECT_DIR/node_modules/@babel/core/lib/transform.js:28:33)
at process._tickCallback (internal/process/next_tick.js:112:11)
@ multi (webpack)-dev-server/client?http://192.168.1.201:8080/sockjs-node (webpack)/hot/dev-server.js ./src/main.js
我做错了什么?我用Vue CLI 3.0.3
推荐答案
您需要将es6.object
更改为es7.object.entries
,以使Object.entries
在较旧的浏览器上运行.
You need to change es6.object
to es7.object.entries
to make Object.entries
work on older browsers.
因此,您的/babel.config.js
应该如下所示:
So your /babel.config.js
should look like the following:
module.exports = {
presets: [
[
"@vue/app",
{
polyfills: ["es7.object.entries"]
}
]
]
};
I have found the polyfills name here: built-in-features.js#L153
这篇关于Vue 3 CLI-如何为Object.entries添加babel polyfill的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!