塩焼きブログ

塩焼きに関しての研究内容を公開しています

vue.jsのvue-routerでArgument of type '{ routes: VueRouter; }' と言われる場合

下記のようなエラーが出てきた

ERROR in /src/ts/app.ts
[tsl] ERROR in /src/ts/app.ts(32,19)
      TS2345: Argument of type '{ routes: VueRouter; }' is not assignable to parameter of type 'ComponentOptions<Vue, DefaultData<Vue>, DefaultMethods<Vue>, DefaultComputed, PropsDefinition<Rec...'.
  Object literal may only specify known properties, and 'routes' does not exist in type 'ComponentOptions<Vue, DefaultData<Vue>, DefaultMethods<Vue>, DefaultComputed, PropsDefinition<Rec...'.

どこかからコピペして下記のようにしていたのだが

let v = new Vue({ routes }).$mount('#app');

実はroutesではなくrouterだった。後省略形は個人的にあまり好きではないので明示的にこのように書く。

let v = new Vue({ router: router }).$mount('#app');

参考

https://stackoverflow.com/questions/47098925/use-vue-router-in-a-mixin