Cannot read property 'android' of undefined

[yusidi]

Version

3.7.0

Environment info

mac

Steps to reproduce

['@vue/app', {
  polyfills: [
    // all polyfills list -> https://github.com/zloirock/core-js
    'es6.object.assign',
    'es6.array.find',
    'es6.array.iterator',
    'es6.function.name',
    'es7.object.values',
    'web.dom.iterable'
  ]

It seem caused by'web.dom.iterable'

What is expected?

build is running

What is actually happening?

Cannot read property 'android' of undefined

['@vue/app', {
  polyfills: [
    // all polyfills list -> https://github.com/zloirock/core-js
    'es6.object.assign',
    'es6.array.find',
    'es6.array.iterator',
    'es6.function.name',
    'es7.object.values',
    'web.dom.iterable'
  ]

It seem caused by'web.dom.iterable'

[LinusBorg]

Hi

Thanks for filing this issue! Could you please provide a small reporduction on jsfiddle.net so we can debug this without trying to replicate this ourselves?`

That would be very helpful, thanks!

[yusidi]

vue create demo。
show tip ‘These dependencies were not found: core-js/modules/web.dom.iterable’，after the code in my project。
we add 'web.dom.iterable' in babel.config.js after that。
vue-cli-service serve, throw error 'Cannot read property 'android' of undefined '

import Vue from 'vue'
import hljs from 'highlight.js/lib/highlight'

import 'highlight.js/styles/github-gist.css'

import shell from 'highlight.js/lib/languages/shell'
import css from 'highlight.js/lib/languages/css'
import markdown from 'highlight.js/lib/languages/markdown'
import js from 'highlight.js/lib/languages/javascript'
import json from 'highlight.js/lib/languages/json'
import xml from 'highlight.js/lib/languages/xml'

hljs.registerLanguage('css', css)
hljs.registerLanguage('markdown', markdown)
hljs.registerLanguage('javascript', js)
hljs.registerLanguage('json', json)
hljs.registerLanguage('shell', shell)
hljs.registerLanguage('xml', xml)

Vue.directive('highlight', (el) => {
  let blocks = el.querySelectorAll('pre code')
  blocks.forEach(block => {
    hljs.highlightBlock(block)
  })
})

[johndab]

Hi, encountered the same issue with any polyfill starting with es.* or web.*
looks like @vue\babel-preset-app\index.js (v3.8) is getting a list of polyfills from

const builtInsList = require('@babel/preset-env/data/built-ins.json')

(I have @babel/preset-env@7.3.4)
then includes contains "web.dom.iterable" which is not in builtInsList

  return includes.filter(item => {
    return isPluginRequired(builtInTargets, builtInsList[item])
  })

builtInsList[item] is undefined which later throws an exception.
So it looks like only keys from this file will work

I can see that it has changed in the recent version of vue-cli and babel-env.

[vue-bot]

Hello!
This issue has gone quiet. Spooky quiet. 👻

We get a lot of issues, so we currently close issues requiring feedback after 20 days of inactivity. It’s been at least 10 days since the last update here. If we missed this issue or if you want to keep it open, please reply here. (A maintainer can also add the label not stale to keep this issue open.)

Thanks for being a part of the Vue community! 💪💚️

[LinusBorg]

Should stay open, something indeed seems fishy

[vue-bot]

Hello!
This issue has gone quiet. Spooky quiet. 👻

We get a lot of issues, so we currently close issues requiring feedback after 20 days of inactivity. It’s been at least 10 days since the last update here. If we missed this issue or if you want to keep it open, please reply here. (A maintainer can also add the label not stale to keep this issue open.)

Thanks for being a part of the Vue community! 💪💚️

[jhildings]

I also have this problem, when adding core-js. Unclear why...

[sodatea]

@jhildings Did you add core-js@3? Vue CLI v3 is only compatible with core-js@2

[Hawxy]

I encountered a similar issue after updating to the latest Vue CLI Alpha+ Babel-Jest 24. Managed to fix it by changing the babel.config.js file to a .babelrc file and removing anything apart from the vue preset. A few remaining Cannot find module 'core-js/modules/es.symbol.xxxxx complaints from our tests were fixed by installing the latest version of core.js.

[doot0]

Encountering this also.

[JFGHT]

In my case it was I was misspelling the polyfill.

'es6.weakmap' -> 'es6.weak-map',

[rs3d]

Updating my babel.config.js fixed this issue for me:

module.exports = {
  presets: [["@vue/cli-plugin-babel/preset", {
    useBuiltIns: "usage",
    polyfills: [
      // module filenames from .\node_modules\core-js\modules\
      'es.promise',  // before "es6.promise"
      'es.symbol',  // before "es6.symbol"
    ],
  }]]
}

[ma7moudat]

Still an issue on macOS with @vue/cli 4.1.2 (with Node v8.16.2 and NPM v6.13.6)
I created a projects with default settings. Builds successfully, but whenever there are polyfills listed the same error occurs.

[jhildings]

For me the error hasn't appeared in a while now... but it's also unclear why. Maybe we did an update of all the packages and it solved itself

[reyisraelt]

Got this working by reinstalling @vue/cli npm install -g @vue/cli.

babel.config.js

module.exports = {
  presets: [['@vue/cli-plugin-babel/preset', {
    polyfills: [
      // modules you can find here: https://github.com/zloirock/core-js
      'es.string.starts-with',
      'web.url-search-params'
    ],
  }]],
};

[czelsa]

I have this error (I will update versions on my project)

Module build failed (from ./node_modules/babel-loader/lib/index.js):
TypeError: [BABEL] /code/frontend/src/main.js: Cannot read property 'android' of undefined (While processing: "node_modules/@vue/babel-preset-app/index.js")

package.json
"dependencies": { "vue": "2.6.10", "vue-moment": "^4.1.0", "vue-router": "3.0.7", "vuex": "3.1.1", "vuex-persist": "2.0.1" }

and
"devDependencies": { "@babel/core": "^7.4.5", "@vue/cli-plugin-babel": "^4.1.1", "@vue/cli-plugin-eslint": "^4.1.1", "@vue/cli-plugin-unit-jest": "^4.1.1", "@vue/cli-service": "^4.1.1", "@vue/eslint-config-airbnb": "^4.0.0", "@vue/test-utils": "^1.0.0-beta.29", "audit-ci": "^1.4.1", "auditjs": "^3.1.1", "babel-core": "7.0.0-bridge.0", "babel-eslint": "^10.0.1", "babel-jest": "^25.1.0", "eslint": "^5.15.3", "eslint-plugin-vue": "^5.2.2", "node-sass": "^4.11.0", "sass-loader": "^7.1.0", "vue-svg-loader": "^0.12.0", "vue-template-compiler": "^2.6.10", "webpack": "^4.33.0", "webpack-dev-server": "^3.3.1" }

babel.config.js

module.exports = {
  presets: [
    ['@vue/app', {
      polyfills: [
        'es6.array.iterator',
        'es6.object.assign',
        'es6.promise',
        'es6.regexp.constructor',
        'es6.regexp.flags',
        'es6.regexp.match',
        'es7.promise.finally',
      ],
    }],
  ],
  plugins: ['@babel/plugin-proposal-optional-chaining'],
};

it happened after I use:
yarn upgrade-interactive

[sodatea]

I suppose it's fixed by this PR: #5543

If anyone encounters this issue again, please open a new issue with a reference to this one if you can follow up with more information.