Vue + Webpack, псевдоним не может разрешиться в тегах скрипта

В любом случае, я новичок во всем этом, я открываю для себя Vue.js.

Поскольку мне не нравится, как вы указываете на разные части приложения Vue, я использую псевдонимы, чтобы решить эту проблему.

В файле webpack.config.js я настроил следующее:

resolve: {
alias: {
  'vue$': 'vue/dist/vue.esm.js',
  'styles': path.resolve(__dirname, './src/scss'),
  'assets': path.resolve(__dirname, './src/assets'),
  'components': path.resolve(__dirname, './src/components'),
  'directives': path.resolve(__dirname, './src/directives')
  //'vue': 'vue/dist/vue.js',
},
extensions: ['*', '.js', '.vue', '.json']
},

Кажется, теперь это работает в тегах шаблона и стиля. Но не в теге скрипта. Как я мог это решить?

<template>
  <div class = "app">
    <img class = "logo" src = "~assets/logo.png">
  </div>
</template>

а также

<style lang = "scss">
  @import "~styles/variables";
</style>

Работа.

Но следующее не работает и выкидывает "Модуль не найден: ошибка: не удается разрешить директивы ~ / inputBus.js"

<script>
  import {imbputBus} from '~directives/inputBus.js';
</script>