Laravel Mix没有将vendor.js转换为es5

时间:2019-03-11 09:21:51

标签: webpack ecmascript-6 ecmascript-5 laravel-mix

Laravel Mix似乎无法将vendor.js和manifest.js转换为ES5。在iPhone Safari和IE 11上失败。

IE DevTools显示以下错误:

IE error

看来它仍然具有ES6功能:

es6

其他文件似乎可以转存,例如app.js和块。

这是我的webpack.mix.js

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

let options = {
  processCssUrls: false,
}

let config = {
  output: {
    chunkFilename: 'assets/js/chunks/[name].js',
    publicPath: '/'
  }
}

if (mix.inProduction()) {
  config.output.chunkFilename = 'assets/js/chunks/[name].[chunkhash].js'
}

mix
  .js('resources/assets/js/app.js', 'public/assets/js')

  .sass('resources/assets/sass/web.scss', 'public/assets/css')
  .sass('resources/assets/sass/fonts.scss', 'public/assets/css')

  .copy('resources/assets/img', 'public/assets/img')
  .copy('node_modules/@fortawesome/fontawesome-free/webfonts','public/assets/webfonts')

  .extract([
      // Libraries...
  ])

  .disableNotifications()
  .webpackConfig(config)
  .options(options)
  .sourceMaps()

if (mix.inProduction()) {
  mix.version()
}

还有我的.babelrc

{
  "plugins": ["syntax-dynamic-import"]
}

我尝试了以下操作:

  1. 安装babel-preset-es2015并将es2015添加到我的.babelrc预设中。
  2. .babel('[...]/vendor.js', '[...]/vendor.es5.js')添加到我的webpack.mix.js

如何获取vendor.js和manifest.js文件以移植到ES5?或者至少可以使其与IE 11和iPhone Safari一起使用。

1 个答案:

答案 0 :(得分:1)

经过一些研究,很明显Laravel Mix 4.x不会转运包含的软件包。为此,请在混合命令之前将以下内容添加到webpack.mix.js文件中:

mix.webpackConfig({
    module: {
        rules: [
            {
                test: /\.jsx?$/,
                exclude: /(bower_components)/,
                use: [
                    {
                        loader: 'babel-loader',
                        options: Config.babel()
                    }
                ]
            }
        ]
    }
});

这将覆盖默认配置,该默认配置将node_modules排除在转译带来的情况之外。