Vue.js Vue+；网页包，别名can'；无法在脚本标记中解析

我对所有这些都是新手，无论如何，我正在发现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>

及

@导入“~样式/变量”；

工作

但以下操作不起作用，并抛出“未找到模块：错误：无法解析“~directions/inputBus.js”

从“~directions/inputBus.js”导入{imbputBus}；

波浪形前缀（

~

）通常只在

或CSS文件中起作用。我很好奇你是怎么让它在

中工作的。在任何情况下，删除

中的

~

前缀都应该允许路径解析工作。因此，我决定启动一个新项目并重试，因为某种原因它可以工作。谢谢你的回答，它帮了我不少忙！当然，没问题：）

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

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