【Flask + Vue.js】TypeError: Cannot read property 'listen' of undefined

Question

FlaskとVue.jsを組み合わせて使いたいと思い、こちらのページを参考に練習しています

現状、Vue.jsによるフロントの実装と、Flask側の設定を終え、flaskを起動したlocalhost:5000/about/にchromeからアクセスしたところ、画面には何も表示されず、デベロッパーツールで以下のエラーが発生します

javascriptのエラーなのかなと思いながらも、vue-cliで自動生成されたファイルに起因しているようで、どう修正したら良いのかがわかりません

どなたか解決策をご教授いただけると嬉しいです

TypeError: Cannot read property 'listen' of undefined
    at qt.init (vue-router.esm.js:2917)
    at An.beforeCreate (vue-router.esm.js:1240)
    at qt (vue.esm.js:1863)
    at nn (vue.esm.js:4228)
    at An.t._init (vue.esm.js:5013)
    at new An (vue.esm.js:5094)
    at Object.NHnr (main.js:10)
    at t (bootstrap dcfbfb42ea55facff20a:54)
    at window.webpackJsonp (bootstrap dcfbfb42ea55facff20a:25)
    at app.c35c09c243bee3381409.js:1
Kt @ vue.esm.js:1897
zt @ vue.esm.js:1888
Vt @ vue.esm.js:1848
qt @ vue.esm.js:1871
nn @ vue.esm.js:4228
t._init @ vue.esm.js:5013
An @ vue.esm.js:5094
NHnr @ main.js:10
t @ bootstrap dcfbfb42ea55facff20a:54
window.webpackJsonp @ bootstrap dcfbfb42ea55facff20a:25
(anonymous) @ app.c35c09c243bee3381409.js:1

TypeError: Cannot read property 'matched' of undefined
    at render (vue-router.esm.js:85)
    at vue.esm.js:3067
    at De (vue.esm.js:3240)
    at vue.esm.js:3431
    at Be (vue.esm.js:3362)
    at t._c (vue.esm.js:3500)
    at a.render (App.vue?e77b:1)
    at a.t._render (vue.esm.js:3557)
    at a.hn.before (vue.esm.js:4075)
    at hn.get (vue.esm.js:4488)

Answer 1

Vue.jsのインストールされているバージョンが@2.6.xだったので,@1.0.0を再インストールしてあげて、既存のnode_modulesを削除、再インストールからビルドまでしてあげると解決しました

$ npm install vue@1.0.0
$ rm -rf node_modules
$ npm install
$ npm audit fix
$ npm run build