Vueファイル の jQuery で $ is not defined にたまに遭遇する

背景

vueでjqueryを使っているときに $ is not defined や,
jQuery is not definedに遭遇するのでソッとメモっておきます

$ is not definedについて

○○.vue

// ＊ 今回はjQueryをCDNで読み込みます
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script>
export default {
  mounted: function () {
  }
}
</script>

vueでjqueryを使う場合

mountedの中にjqueryの処理を書いていきますが、

下記のようにその中でいきなり $ を使った変数の宣言を行うと

<script>
export default {
  mounted: function () {
    $(".〇〇").click(function () {
    })
  }
}
</script>

$ is not definedというエラーに遭遇します。

解決法

下記のように、jQuery(function ($) {}をmountedの中に追記します

<script>
export default {
  mounted: function () {
　　 jQuery(function ($) {
    　$(".〇〇").click(function () {
      })
    })
  }
}
</script>

jQuery is not definedについて

これは自分の場合ですが、jqueryの読み込みをbodyタグの中で行っていた場合にこのエラーが出ました。

参考：
https://teratail.com/questions/32854