Vue.js+TypeScriptのscrollBehaviorで「’to’ is defined but never used」…
今回はVue.js+TypeScript環境で「’to’ is defined but never used」「’from’ is defined but never used」「’savedPosition’ is defined but never used 」の三つのwarningが起きたときの対処法についてご紹介いたします。
Vue.js+TypeScriptのscrollBehaviorで「’to’ is defined but never used」…
Vue.js+TypeScript環境で何も設定しない場合は、ページ遷移の場合にスクロールの位置が自動的にトップの位置になりません。
調べると分かりますが、下記のようにindex.tsなどにあるVueRouterの定義にscrollBehaviorを追加してやるとページ遷移したときに自動的にトップの位置に移動されます。
|
1 2 3 4 5 6 7 8 |
const router = new VueRouter({ mode: 'history', base: process.env.BASE_URL, routes, scrollBehavior (to, from, savedPosition) { return { x: 0, y: 0 } } }) |
しかし、これをそのまま書くと、
warning 'to’ is defined but never used @typescript-eslint/no-unused-vars
warning 'from’ is defined but never used @typescript-eslint/no-unused-vars
warning 'savedPosition’ is defined but never used @typescript-eslint/no-unused-vars
の三つのwarningが出てしまいます。
解決策は簡単で、下記のように引数をなくしてみましょう。
引数をなくしても問題なく動きます。
|
1 2 3 4 5 6 7 8 |
const router = new VueRouter({ mode: 'history', base: process.env.BASE_URL, routes, scrollBehavior () { return { x: 0, y: 0 } } }) |
ぜひお試しください。
終わりに
今回はVue.js+TypeScript環境で「’to’ is defined but never used」「’from’ is defined but never used」「’savedPosition’ is defined but never used 」の三つのwarningが起きたときの対処法についてご紹介いたしました。