vue単一ファイルコンポーネントをrequireで読み込みたい時

背景

すごくマイナー需要そうですが、
諸事情あって環境変数に応じて読み込むvueファイルを分けたい時に、
importはif文の中にかけないし、
両方のファイルをimportするとバンドルファイルが重くなるし・・
で、requireで読み込めば分岐できるじゃん！となったのですが、
一筋縄では行きませんでした。

ハマった

let renderObj;

if (process.env.NODE_ENV == 'development') {
  renderObj = {
    render: h => h(require("./vue/dev/App.vue"))
  }
} else {
  renderObj = {
    render: h => h(require("./vue/prod/App.vue"))
  }
}

new Vue(renderObj).$mount("#vue-mount");

こんなんでいけるでしょう！
と思ったら

Failed to mount component: template or render function not defined

怒られました。
おそらくrequireあたりが通ってないんだろうなと思いつつよくわからなかったので、
エラー文をググったら答えが出てきました。
https://github.com/vuejs/vue-router/issues/1882

##解決

let renderObj;

if (process.env.NODE_ENV == 'development') {
  renderObj = {
    render: h => h(require("./vue/dev/App.vue").default)
  }
} else {
  renderObj = {
    render: h => h(require("./vue/prod/App.vue").default)
  }
}

new Vue(renderObj).$mount("#vue-mount");

requireしたパスのうしろに、defaultをつけるだけ。

どうやらvue単一ファイルコンポーネントではexport defaultが使われているので、
requireするときにもdefaultつける必要があるそうな。

##あとがき
vueでmodule.exportsって使えるのかな・・・？