v-bind:srcでハマった

nuxtで開発していてハマったので記録を残しておきます。
やりたかったことはオブジェクトの中身を全てrequireして画像を表示したいというものです。

結局問題だったのはWebpackのところで、静的パスを指定する必要がありました。
っていう内容です。

const store = () => new Vuex.Store({

  state: {
    data: {}
  },
  mutations: {
    getDocuments(state) {
      // 画像を取得する
    }
  },
  getters: {
    getImgPath: state => {
      return require(state.data.img) // ここでエラー
    }
  },
  actions: {}
})

静的に指定しなければならないので以下のように修正したところエラーを解消することができました。

const store = () => new Vuex.Store({

  state: {
    data: {}
  },
  mutations: {
    getDocuments(state) {
      // 画像を取得する
    }
  },
  getters: {
    getImgPath: state => {
      // data.imgは画像ファイル名となるようにする
      return require('~/assets/' + state.data.img + '.jpg')
    }
  },
  actions: {}
})

もっとスマートな方法あれば教えて頂きたいです。