Vuejs Support for Legacy Browsers — Laravel
I hope this post will help fellow coders that will have the unfortunate luck of running into the headache I endured recently when finalizing yet another Laravel project.
After a couple of weeks of coding away Vuejs components — all tested using Mozilla Firefox. I started testing my application against other browsers. The application worked as intended on all the other browsers, but Internet Explorer 11 (IE11); every area covered by my Vuejs components were blank.
I did some Google searches and tried out some of the solutions I found from various sources, and they were all useless. This is my solution and I hope it will be of use to you fellow coder — I’ll try keep it short, simple and direct.
npm install --save-dev targets-webpack-plugin
yarn add --dev targets-webpack-plugin
Under your project root, open webpack.mix.js, require ‘targets-webpack-plugin’ and make alterations to the webpackConfig as shown on the image below.
Run the command below then re-run your application.
npm run dev
‘targets-webpack-plugin’ is a webpack plugin for transcompilig final bundles so they support legacy browsers. To learn more, follow this link:
Webpack plugin for logacy browser transcompilation (including dependencies)www.npmjs.com
I hope this will be helpful to you as it was helpful to me. Cheers!