こんにちは、樋口です。
今回は、Nuxt.jsのeslint機能によって出力されるエラーの解決策を記載いたします。
※ 今回は「npm」コマンドを使用して説明を行います。
ソースコード
今回のエラーが発生するコードは下記ソースとなります。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
<template> <div class="samaple__conntents"> <div style="margin-top: 20px;"> <h1>Font awesome</h1> </div> </div> </template> <script> export default { data() { return { count: 0, } }, computed: { test() { let testParam = 100 return testParam }, }, } </script> |
エラー内容（error ‘testParam’ is never reassigned. Use ‘const’ instead prefer-const）
ソースを実行した際に下記エラーが発生します。
error ‘testParam’ is never reassigned. Use ‘const’ instead prefer-const
エラー発生時の環境
エラー発生時の環境は、下記の通りです。
- Vue.js
- 2.6.11
- Nuxt.js
- 2.12.2
エラー解決方法
今回のエラーの原因は、値の変更がない変数を「let」で宣言しているので「const」に変更しろというエラーとなります。ソースを下記内容に修正することによりエラーがなくなります。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
<template> <div class="samaple__conntents"> <div style="margin-top: 20px;"> <h1>Font awesome</h1> </div> </div> </template> <script> export default { data() { return { count: 0, } }, computed: { test() { let testParam = 100 ← 変数宣言をletから、constに変更します return testParam }, }, } </script> |
修正後ソース
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
<template> <div class="samaple__conntents"> <div style="margin-top: 20px;"> <h1>Font awesome</h1> </div> </div> </template> <script> export default { data() { return { count: 0, } }, computed: { test() { const testParam = 100 return testParam }, }, } </script> |
これで無事、解決です。
《関連記事》
- 【エラー解決方法】Nuxt.js で「error Insert
⏎prettier/prettier」が発生したときの対処法 - Vue.jsベースのフレームワーク！ Nuxt.jsプラグイン《HTML要素のドラッグアンドドロップ》
- 【エラー解決方法】Nuxt.js で「error ” is assigned a value but never used no-unused-vars」が発生したときの対処法
- 【エラー解決方法】Nuxt.js で「error Insert
·prettier/prettier」が発生したときの対処法 - お祝いごとにぴったり！ Nuxt.jsプラグイン《アニメーションで紙吹雪を表現》
