Webpack: npm run dev - eslint errors

Created on 21 Nov 2016  ยท  7Comments  ยท  Source: vuejs-templates/webpack

step

$ vue init wepack
$ sudo npm i
$ npm run dev

errors

ERROR in ./src/main.js

  โœ˜  https://google.com/#q=import%2Fno-unresolved  Unable to resolve path to module './App'
 src/main.js:2:17
  import App from './App';
                   ^

  โœ˜  https://google.com/#q=import%2Fextensions     Missing file extension for "./App"
 src/main.js:2:17
  import App from './App';
                   ^


โœ˜ 2 problems (2 errors, 0 warnings)


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

ERROR in ./src/App.vue

  โœ˜  https://google.com/#q=import%2Fno-unresolved  Unable to resolve path to module './components/Hello'
 src/App.vue:9:19
  import Hello from './components/Hello';
                     ^

  โœ˜  https://google.com/#q=import%2Fextensions     Missing file extension for "./components/Hello"
 src/App.vue:9:19
  import Hello from './components/Hello';
                     ^


โœ˜ 2 problems (2 errors, 0 warnings)

environment

โžœ  webpack git:(gh-pages) โœ— node -v
v6.9.1
โžœ  webpack git:(gh-pages) โœ— npm -v
3.10.8
โžœ  webpack git:(gh-pages) โœ— webpack --help
webpack 1.13.3
need repro

Most helpful comment

@kushalpandya same error here! Solved it by updating all the eslint dependencies.

"eslint": "^3.14.1",
"eslint-config-airbnb-base": "^11.0.1",
"eslint-friendly-formatter": "^2.0.7",
"eslint-import-resolver-webpack": "^0.8.1",
"eslint-loader": "^1.5.0",
"eslint-plugin-html": "^2.0.1",
"eslint-plugin-import": "^2.2.0",

All 7 comments

I Close this eslint errors.

  // add your custom rules here
  'rules': {
    // don't require .vue extension when importing
    'import/extensions': ['off', 'always', {
      'js': 'never',
      'vue': 'never'
    }],
    'import/no-unresolved': [0, {commonjs: true, amd: true}],
    // allow debugger during development
    'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0
  }

but I think is'not the best solution.

I can't reproduce this issue by your provide step, do you break files structure?

no, I make new dir and do the step.

It's OK now. Maybe I make a mistake. Thanks @moonou

I'm facing exact same problem after updating to latest template config, directory structure is same as it was before (prior to Webpack 2 update). All my config files are exact same as webpack template of this repo, anything that I'm missing here?

@kushalpandya same error here! Solved it by updating all the eslint dependencies.

"eslint": "^3.14.1",
"eslint-config-airbnb-base": "^11.0.1",
"eslint-friendly-formatter": "^2.0.7",
"eslint-import-resolver-webpack": "^0.8.1",
"eslint-loader": "^1.5.0",
"eslint-plugin-html": "^2.0.1",
"eslint-plugin-import": "^2.2.0",

Followed instructions but still facing errors when I npm run dev on Windows 10. Tried reverting to older versions @lindesvard suggested, but still didn't work. Definitely an issue with eslint-airbnb config as setting up with standard works.

Options:

  • runtime + compiler
  • vue-router
  • eslint
    --airbnb
 ERROR  Failed to compile with 2 errors                     14:08:38

 error  in ./src/main.js


  โœ˜  https://google.com/#q=import%2Fno-unresolved  Casing of vue doe
s not match the underlying filesystem       
  src\main.js:3:17
  import Vue from 'vue';
                   ^

  โœ˜  https://google.com/#q=import%2Fno-unresolved  Casing of ./App d
oes not match the underlying filesystem     
  src\main.js:4:17
  import App from './App';
                   ^

  โœ˜  https://google.com/#q=import%2Fno-unresolved  Casing of ./route
r does not match the underlying filesystem  
  src\main.js:5:20
  import router from './router';
                      ^


โœ˜ 3 problems (3 errors, 0 warnings)


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

 @ multi ./build/dev-client ./src/main.js

 error  in ./src/router/index.js


  โœ˜  https://google.com/#q=import%2Fno-unresolved  Casing of vue doe
s not match the underlying filesystem                      
  src\router\index.js:1:17
  import Vue from 'vue';
                   ^

  โœ˜  https://google.com/#q=import%2Fno-unresolved  Casing of vue-rou
ter does not match the underlying filesystem               
  src\router\index.js:2:20
  import Router from 'vue-router';
                      ^

  โœ˜  https://google.com/#q=import%2Fno-unresolved  Casing of @/compo
nents/HelloWorld does not match the underlying filesystem  
  src\router\index.js:3:24
  import HelloWorld from '@/components/HelloWorld';
                          ^


โœ˜ 3 problems (3 errors, 0 warnings)


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

 @ ./src/main.js 5:0-30
 @ multi ./build/dev-client ./src/main.js

> Listening at http://localhost:8080
Was this page helpful?
0 / 5 - 0 ratings