title: How can I define and use my own custom services in Nuxt with TypeScript?
body: <p>When making my TS Nuxt App I realized it made sense to define an ApiService that communicates with the API, so I created a folder named <code>services</code> and put my service file in it, so I had <code>services/api-service.ts</code>.</p>
  <p>The content of the file was something like</p>
  <pre><code>import axios from 'axios'    
  export default class ApiService {
        static someRequest(data: dataType) {
          return axios.get(&quot;someEndpoint&quot;, data)
        }
  }
  </code></pre>
  <p>I tried importing it in my layout where I needed it, as such:</p>
  <pre><code>import ApiService from '@/services/api-service'
  ...
    created () {
    ...
      ApiService.someRequest(data)
        .then(someMethod)
        .catch(console.log)
    }
  </code></pre>
  <p>and although my IDE didn't complain, Nuxt couldn't find it when compiling, giving me an error message like</p>
  <pre><code>This dependency was not found:                                                                friendly-errors 09:20:35
                                                                                                friendly-errors 09:20:35
  * @/services/api-service in ./node_modules/babel-loader/lib??ref--2-0!./node_modules/@nuxt/components/dist/loader.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./layouts/default.vue?vue&amp;type=script&amp;lang=js&amp;
  </code></pre>
  <p>I've tried to include it as a module, but apparently modules are limited to exporting functions, hence exporting classes is a no go. Making a plugin does not seem like the logical solution either. How can I use a custom service class such as my ApiService in a TS Nuxt App?</p>