VuetifyにIEを対応させる

弊社HPですが、なんとIEでみるとこうなっております。

Vuetifyを使っていまして、IE対応しないとこのように潔く真っ白になっていました。

VuetifyをIE対応させる

ここに書いてあります。

https://vuetifyjs.com/ja/getting-started/quick-start#ie11-safari-9-support — vuetifyjs.com

やり方

babel-polyfillを追加します。

$ yarn add babel-polyfill

main.jsに追加します。

import 'babel-polyfill'

@babel/preset-env -d というのも追加します。

yarn add @babel/preset-env -d

babel.config.jsに下記を追加します。

module.exports = {
  presets: ['@babel/preset-env']
}

結果

真っ白ではなくなりましたが、画像やボタンなどことごとくサイズ感を無視しており、社名ロゴに至っては表示されていません。

つづく