找不到要导入的文件答案

【问题标题】：File to import not found找不到要导入的文件
【发布时间】：2018-01-30 06:35:28
【问题描述】：

所以我正在尝试将我的 SCSS 文件以及所有 vars 和 mixins 定义导入到我拥有的所有组件中。 defs 的文件名为 _defs.scss：

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

some component styling
</style>

我还在 webpack 中使用了别名来定义查找样式文件夹的位置：

resolve: {
  alias: {
    'vue$': 'vue/dist/vue.esm.js',
    assets: path.resolve(__dirname, "src/assets/"),
    styles: path.resolve(__dirname, "src/styles/")
  }
}

但由于某种原因，webpack 仍然会抛出错误，告诉他找不到导入文件。
我哪里错了？

Project Structure

【问题讨论】：

How to preload variables in a component style的可能重复
问题不是关于在全局范围内定义变量的方法。问题是关于为什么我的路径不起作用。
嗨，你的意思是你已经导入了sass-resources-loader？
你好，我的意思是我不在这里使用它。我问为什么 webpack 找不到导入的文件，但是我在 resolve.alias 中定义了在哪里寻找它。
好的，你能分享一下你的项目结构吗？

标签： webpack sass vue.js vue-component

【解决方案1】：

变化

@import "styles/defs";

到

@import "~styles/defs";

将解决问题。见：explanation。

【讨论】：

【解决方案2】：

我已经好几个月没有使用 webpack 了，但是你能检查一下吗：

https://webpack.github.io/docs/resolving.html, http://moduscreate.com/es6-es2015-import-no-relative-path-webpack/

【讨论】：

也许我是盲人，但似乎一切都是正确的。我已经有一段时间了，所以决定在这里写，以防我看不到我犯的一些错误。