jorgenb's avatar
Level 16

Bootstrap Vue with polyfills to support IE11 and Mix

I have L5.8 project that has a JS frontend that uses https://bootstrap-vue.js.org.

Now, I need to support IE11 and BV's docs says that I can do that by adding various polyfills:

https://bootstrap-vue.js.org/docs#js

Can I somehow accomplish this with Mix?

Current Mix config:

const mix = require('laravel-mix');

require('laravel-mix-polyfill');

/*
 |--------------------------------------------------------------------------
 | Mix Asset Management
 |--------------------------------------------------------------------------
 |
 | Mix provides a clean, fluent API for defining some Webpack build steps
 | for your Laravel application. By default, we are compiling the Sass
 | file for the application as well as bundling up all the JS files.
 |
 */

mix.js('resources/js/app.js', 'public/js')
   .extract(['vue'])
   .sass('resources/sass/app.scss', 'public/css')
   .polyfill({
    enabled: true,
    useBuiltIns: "usage",
    targets: [
      "last 1 major version",
      ">= 1%",
      "Chrome >= 45",
      "Firefox >= 38",
      "Edge >= 12",
      "Explorer >= 10",
      "iOS >= 9",
      "Safari >= 9",
      "Android >= 4.4",
      "Opera >= 30"
    ]
   })
   .copyDirectory('resources/assets', 'public/img')
   .disableNotifications()

   if (mix.inProduction()) {
     mix.version()
   } else {
     mix.sourceMaps()
   }
0 likes
1 reply

Please or to participate in this conversation.