VueJs 3 + Vuetify: Not working in IE and Edge
If you created the project using vue-cli and added vuetify using vue add vuetify
, then the solution to make it work in Edge should be to add transpileDependencies: ['vuetify']
to the vue.config.js file.
But in my case I added vue/vuetify to an already existing project and did not use vue-cli. So to make it work I installed core-js npm install core-js@2 --save
and added this to the rules in my webpack.config.js
{
test: /\.js$/,
exclude: /node_modules\\(?!(vuetify)).*/,
use: [
{
loader: 'babel-loader',
options: {
configFile: './babel.config.js',
}
}
]
}
Then I added the babel.config.js file to the root of the project.
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',
]
}
A little late reply, but I couldn't find this solution anywhere else and this was one of the first posts showing up when I was searching for it myself. So I figured I'll post what worked for me here.