vue-cli webpack模板配置alias无效？

Question

如题

webpack.base.conf.js 配置如下：

src下有Home.vue跟store目录，store下面有个index.js

页面引入：

import store from 'store'

控制台报错：

ERROR in ./src/Home.vue

  ✘  https://google.com/#q=import%2Fno-unresolved  Unable to resolve path to module 'store'
  /Users/xx/Documents/demo/src/Home.vue:35:19
  import store from 'store'
                     ^


✘ 1 problem (1 error, 0 warnings)


Errors:
  1  https://google.com/#q=import%2Fno-unresolved

ERROR in ./~/babel-loader?presets[]=es2015&plugins[]=transform-runtime&comments=false!./~/vue-loader/lib/selector.js?type=script&index=0!./src/Home.vue
Module not found: Error: Cannot resolve module 'store' in /Users/xx/Documents/demo/src
 @ ./~/babel-loader?presets[]=es2015&plugins[]=transform-runtime&comments=false!./~/vue-loader/lib/selector.js?type=script&index=0!./src/Home.vue 15:13-29

但是我页面引入时改成相对路径又可以：

import store from './store'

……

重新vue init了一个写了alias确实没问题… 看样子问题出在eslint上，贴一下eslintrc，有空的大神帮我看看

module.exports = {
  root: true,
  // parser: 'babel-eslint',
  parserOptions: {
    sourceType: 'module'
  },
  extends: 'airbnb-base',
  // required to lint *.vue files
  plugins: [
    'html'
  ],
  // add your custom rules here
  'rules': {
    'no-debugger': process.env.NODE_ENV === 'production' ? 1 : 0,
    "semi": [2, "never"],
    "no-console": [0],
    "space-before-function-paren": [2, "always"],
    "prefer-const": [0],
    "eol-last": [0],
    "no-param-reassign": [0],
    "no-shadow": [0],
    "arrow-body-style": [0],
    "comma-dangle": [0],
    "space-in-parens": [0],
    "prefer-rest-params": [0],
    "quote-props": [0],
    "func-names": [0],
    "guard-for-in": [0],
    "object-shorthand": [0],
    "no-use-before-define": [0],
    "computed-property-spacing": [0],
    "consistent-return": [0],
    "camelcase": [0],
    "no-return-assign": [0],
    "no-extend-native": [0],
    "no-else-return": [0],
    "dot-notation": [0],
    "prefer-template": [0],
    "no-restricted-syntax": [0],
    "no-unresolved": [0]
  }
}

Answer 1

大兄弟，我刚刚也是这个问题。
用你采纳的方法也不行，后来琢磨了一下，解决了。
问题出在你是不是 npm run dev 后改的 webpack.base.conf.js 这个文件？
这个东西是在 npm run dev 后就运行一遍的。如果改动的话，必须重新 npm run dev。

答案不应该是 eslint 的问题。

Answer 2

谢邀

应该用root而非alias

https://webpack.github.io/doc...

Answer 3

不确定问题出现在哪里，因为我试着用和你一样的配置并没有复现你的问题，不会是文件夹名字打错了吧。。。

Answer 4

不确定alias有没有问题。

但是我的解决方案是：使用webpack的web_modules

http://webpack.github.io/docs...

Answer 5

import是ES6的语法，原理和require差不多。

当 Node 遇到 require(X) 时，按下面的顺序处理。
1.如果 X 是内置模块（比如 require('http'）)
　　a. 返回该模块。
　　b. 不再继续执行。
2.如果 X 以 "./" 或者 "/" 或者 "../" 开头
　　a. 根据 X 所在的父模块，确定 X 的绝对路径。
　　b. 将 X 当成文件，依次查找下面文件，只要其中有一个存在，就返回该文件，不再继续执行。

    X
    X.js
    X.json
    X.node

　　c. 将 X 当成目录，依次查找下面文件，只要其中有一个存在，就返回该文件，不再继续执行。

    X/package.json（main字段）
    X/index.js
    X/index.json
    X/index.node

3.如果 X 不带路径
　　a. 根据 X 所在的父模块，确定 X 可能的安装目录。
　　b. 依次在每个目录中，将 X 当成文件名或目录名加载。
4.抛出 "not found"

详见阮一峰老师的文章：http://www.ruanyifeng.com/blo...

Answer 6

store跟vuex的store冲突了吧 你起个stores试试

Answer 7

搞定了
在.eslintrc的'rules'加上:

'import/no-unresolved': 0,