swiper
webpacker

webpackerでswiperを利用する際に Unexpected token: name (Dom7) と出た場合の対処法

結論

dom7とswiperをbabel-loaderのexcludeから外す。

// config/webpack/swiper_config.js
module.exports = {
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules\/(?!(dom7|swiper)\/).*/,
        loader: 'babel-loader'
      }
    ]
  }
};
// config/webpack/environment.js
const { environment } = require('@rails/webpacker')
const swiperConfig = require('./swiper_config')

environment.config.merge(swiperConfig)

module.exports = environment

理由

swiperの3.4.2からES5で配布されなくなったようなので、ビルド時にトランスパイルする必要がある。コードがdom7に依存しているので、あわせてbabel-loaderの除外対象から除外する必要がある。(webpackerのデフォルトはnode_modules全体を除外している)