Question

我不确定我在做什么错。我有VueJs 3和Vuetify。与Chrome和Firefox搭配使用时效果很好，但无法在IE和Edge中加载。我正在尝试使用Babel加载polyfill，并强制Vue CLI转换Vuetify的依赖项。

package.json

"babel": {
  "presets": [
    [
      "@babel/preset-env",
      {
        "useBuiltIns": "entry"
      }
    ]
  ]
}

vue.config.js

module.exports: {
  transpileDependencies: ['vuetify']
}

main.ts

import 'core-js/es6';
import 'regenerator-runtime/runtime';

导入文件包含在我的main.ts文件顶部。我一直在使用官方文档进行设置。

我在这里想念什么？

Answer 1

如果您使用vue-cli创建了项目并使用vue add vuetify添加了vuetify，那么使其在Edge中工作的解决方案应该是将transpileDependencies: ['vuetify']添加到vue.config.js文件中。 / p>

但是在我的情况下，我将vue / vuetify添加到了一个已经存在的项目中，并且没有使用vue-cli。为了使其正常工作，我安装了core-js npm install core-js@2 --save，并将其添加到webpack.config.js中的规则中。

{
    test: /\.js$/,
    exclude: /node_modules\\(?!(vuetify)).*/,
    use: [
        {
            loader: 'babel-loader',
            options: {
                configFile: './babel.config.js',
            }
        }
    ]
}

然后我将babel.config.js文件添加到项目的根目录。

module.exports = {
    presets: [
        ['@babel/preset-env', {
            debug: true,
            useBuiltIns: 'usage',
            corejs: { "version": 2, "proposals": true }
        }],
    ],
    plugins: [
        '@babel/plugin-proposal-object-rest-spread',
        '@babel/plugin-transform-spread',
    ]
}

稍晚的回复，但是我在其他任何地方都找不到此解决方案，这是我自己搜索时出现的第一批帖子之一。所以我想在这里发布对我有用的东西。

Answer 2

我最终只是删除了Vuetify（我只是从其中使用了一个易于替换的功能）并使用了babel polyfill CDN。可能不是最好的解决方案，但现在可以使用。

VueJs 3 + Vuetify：在IE和Edge中不起作用

2 个答案: