Vue.js 兼容性配置

iview报错:Promise 不支持

1. vue.config.js 中的 transpileDependencies 选项添加依赖名称。

默认情况下 babel-loader 会忽略所有 node_modules 中的文件。如果你想要通过 Babel 显式转译一个依赖,可以在这个选项中列出来。

transpileDependencies: ['iView']

2.babel.config.js 中使用 @vue/babel-preset-app 的 polyfills 选项预包含所需要的 polyfill。

module.exports = {
  presets: [
    ['@vue/app', {
      polyfills: [
        'es6.promise'
      ]
    }]
  ]
}

3.使用 useBuiltIns: 'entry' 然后在入口文件添加 import '@babel/polyfill'(最终的包大小可能会增加)

网上搜到一般都是 webpack 的 config 文件中配置入口文件

module.exports = {
    entry: {
        app: ['babel-polyfill', './src/main.js']
    },
}

但是我用的 Vue2.6.10, 默认没有 webpack 的配置文件,就在 babel.config.js 中设置(也可以在 .babelrc 中设置)

module.exports = {
  presets: [
    [
      '@vue/app', {
        useBuiltIns: 'entry',
        polyfills: [
          'es6.promise',
          'es6.symbol',
          'es6.array.find-index',
          'es7.array.includes',
          'es6.string.includes',
        ]
      },
    ]
  ]
};