IE11＋Vue.jsで画面が真っ白になる（@babel/polyfillについて）

タイトルの通り、vueで作ったページをie11で表示させると画面が真っ白になります。
https://nansystem.com/migrate-babel-polyfill-to-core-js/
こちらのページを参考に環境を作りました。

（の前にimport "@babel/polyfill"も試してはみました。。）

json
1// package.json
2"devDependencies": {
3    "@babel/core": "^7.4.5",
4    "@babel/preset-env": "^7.4.5",
5    "babel-loader": "^8.0.6",
6    "core-js": "^3.1.2",
7    "regenerator-runtime": "^0.13.2",
8    "body-scroll-lock": "^2.6.4",
9    "css-loader": "^3.4.0",
10    "file-loader": "^5.0.2",
11    "gulp": "^4.0.2",
12    "gulp-autoprefixer": "^7.0.1",
13    "gulp-clean-css": "^4.2.0",
14    "gulp-notify": "^3.2.0",
15    "gulp-plumber": "^1.2.1",
16    "gulp-sass": "^4.0.2",
17    "gulp-sourcemaps": "^2.6.5",
18    "hooper": "^0.3.4",
19    "url-loader": "^3.0.0",
20    "vue-click-outside": "^1.0.7",
21    "vue-loader": "^15.8.3",
22    "vue-style-loader": "^4.1.2",
23    "vue-swatches": "^1.0.4",
24    "vue-template-compiler": "^2.6.11",
25    "webpack": "^4.41.6",
26    "webpack-stream": "^5.2.1",
27    "vue": "^2.6.11"
28  }

javascript
1//gulpfile.js
2gulp.task('bundle', function () {
3  return gulp.src([paths.entry])
4    .pipe(plumber())
5    .pipe(webpackStream({
6      output: {
7        filename: './bundle.js',
8      },
9      module: {
10        rules: [
11          {
12            test: /.vue$/,
13            loader: 'vue-loader',
14            options: {
15              options: {
16                presets: [
17                  'es2015',
18                  {
19                    targets: {
20                      browsers: ['last 2 versions', 'safari 7', 'edge 14', 'ie 11'],
21                    },
22                  },
23                ],
24              },
25            },
26          },
27          {
28            test: /.js$/,
29            resourceQuery: paths.js + 'src/',
30            loader: 'babel-loader',
31            options: {
32              presets: [
33                'es2015',
34                {
35                  targets: {
36                    browsers: ['last 2 versions', 'safari 7', 'edge 14', 'ie 11'],
37                  },
38                },
39              ],
40            }
41          },
42          {
43            test: /.css$/,
44            oneOf: [
45              {
46                resourceQuery: /module/,
47                use: [
48                  'vue-style-loader',
49                  {
50                    loader: 'css-loader',
51                    options: {
52                      modules: true,
53                      localIdentName: '[local]_[hash:base64:5]',
54                    },
55                  },
56                ],
57              },
58              {
59                use: ['vue-style-loader', 'css-loader'],
60              },
61            ],
62          },
63          {
64            test: /.(png|jpe?g|gif)$/i,
65            use: [
66              {
67                loader: 'file-loader',
68                options: {
69                  name: '[name].[ext]',
70                  outputPath: '../images/compile/',
71                  publicPath: '../assets/images/compile/',
72                  esModule: false,
73                },
74              },
75            ],
76          },
77        ],
78      },
79      resolve: {
80        extensions: ['.js', '.vue'],
81        modules: [
82          "node_modules"
83        ],
84        alias: {
85
86        }
87      },
88      plugins: [
89        new webpack.DefinePlugin({
90          'process.env': {
91            NODE_ENV: '"production"'
92          }
93        }),
94        new webpack.optimize.AggressiveMergingPlugin(),
95        new webpack.ProvidePlugin({
96          jQuery: "jquery",
97          $: "jquery",
98          jquery: "jquery"
99        }),
100        new VueLoaderPlugin(),
101      ]
102    }, null, function (err, stats) {
103      if (stats.compilation.errors.length) {
104        notify.onError({
105          title: 'Webpack error',
106          message: stats.compilation.errors[0].error,
107          sound: 'Frog',
108        });
109      }
110    }))
111    .pipe(gulp.dest(paths.js))
112    .pipe(notify("Bundle JS Success!"));
113});

html側でv-cloak(css:display: none;)を指定しており、これを削除するとページ自体は表示されるのですが、モーダルなどが表示されてしまいjavascriptが無効になってしまっています。

コンソールを見てもエラーも表示されず、どこが悪いのかわかりません。

行動規範の内容に同意します

回答1件

自己解決

babel.config.jsの useBuiltIns" 'usage'のところをuseBuiltIns: 'entry'に変更すればエラーが表示されるようになり、構文を一つずつ直していったところ無事に表示されました。

javascript
1module.exports = function (api) {
2  api.cache(true);
3
4  const presets = [["@babel/preset-env", {
5    useBuiltIns: "entry",
6    corejs: 3,
7  }]];
8
9  return {
10    presets,
11  };
12}
13