Vue Loader 无法解析'@'

Question

版本

15.4.0

复制link

https://codepen.io/fendi-tri-cahyono/pen/wbXKMZ?editors=0010

重现步骤

ERROR in ./node_modules/vue-extend-layout/vue-extend-layout.vue?vue&type=script&lang=js& (./node_modules/vue-loader/lib??vue-loader-options!./node_modules/vue-extend-layout/vue-extend-layout.vue?vue&type=script&lang=js&)
Module not found: Error: Can't resolve '@' in '/Users/fenditricahyono/Projects/titipbeliin/titipbeliin-vue/node_modules/vue-extend-layout'
 @ ./node_modules/vue-extend-layout/vue-extend-layout.vue?vue&type=script&lang=js& (./node_modules/vue-loader/lib??vue-loader-options!./node_modules/vue-extend-layout/vue-extend-layout.vue?vue&type=script&lang=js&) 50:19-96
 @ ./node_modules/vue-extend-layout/vue-extend-layout.vue?vue&type=script&lang=js&
 @ ./node_modules/vue-extend-layout/vue-extend-layout.vue
 @ ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options!./src/App.vue?vue&type=script&lang=js&
 @ ./src/App.vue?vue&type=script&lang=js&
 @ ./src/App.vue
 @ ./src/main.js

期望什么？

可以为从“@/something.vue”导入一些东西，不只是从 '../../something.vue',

导入一些东西

实际发生了什么？

找不到模块：错误：无法解析“/Users/fenditricahyono/Projects/titipbeliin/titipbeliin-vue/node_modules/vue-extend-layout”中的“@”

Answer 1

为了扩展 Phil 的评论，我假设你没有使用 Vue CLI 初始化项目（通过你的 webpack 配置），你正在寻找的应该是一个别名（用 @ 符号是常用的 and/or 由 CLI 生成）映射到项目目录的根路径。因此，请尝试在 resolve.alias 对象下添加以下额外行：

{
  // ...

  resolve: {
    alias: {
      // Relative path to your root dir (adjust accordingly)
      '@': path.resolve(__dirname, './src'),

      vue$: 'vue/dist/vue.esm.js',
    },
    extensions: ['*', '.js', '.vue', '.json'],
  },

  // ...
}

Vue Loader 无法解析'@'

Vue Loader Can't resolve '@'

vue.js

vue-loader

版本

复制link

重现步骤

期望什么？

实际发生了什么？