Nuxt.js エラー「Module not found: Error:Can’t resoleve ‘less-loader’」が発生した場合の対処法

Nuxt.js エラー「Module not found: Error:Can’t resoleve ‘less-loader’」が発生した場合の対処法

コードに「 style lang=”less”」 追加時に「Module not found: Error:Can’t resoleve ‘less-loader’」が発生した際の原因と対処法を記述してます。

環境

  • OS  CentOS Linux release 8.0.1905 (Core)
  • node V12.16.3
  • npm 6.14.4
  • nuxt 2.12.2

エラー全文

下記のコードをvueファイルに追加時に発生

<style lang="less" rel="stylesheet/less" scoped>
  .icon {
    &:hover {
      cursor: pointer;
    }
  }
</style>

エラー内容

Module not found: Error:Can't resoleve 'less-loader'

エラー画像

対処法

エラーメッセージ通り「less-loader」がないため発生しているのでインストールしてあげれば改善される。lessコンパイラもインストールしておきます。

 yarn add less less-loader