vue.js jquery import syntax error

https://google.com/#q=import%2Fno-webpack-loader-syntax  Unexpected '!' in 'expose-loader?$!expose-loader?jQuery!j query'. Do not use import syntax to configure webpack loaders

위와 같은 코드에러가 났을 때!

eslint 때문에...!!!!

삽질을 몇 시간동안 한듯

 

다시 호흡 가다듬고 jquery 설치부터

 

1. 먼저 jquery를 install 해준다.

npm install jquery --save

 

2. build/webpack.base.conf.js 파일에 plugins 추가

module.exports = {
  plugins: [
    new webpack.ProvidePlugin({
      $: 'jquery',
      jquery: 'jquery',
      'window.jQuery': 'jquery',
      jQuery: 'jquery'
    })
  ]
  ...
}

 

3. 그리고 webpack.base.conf.js 파일(2번과 같은 파일) 최상단에 webpack 적어두고,

const webpack = require('webpack')

 

4. 만약 eslint 사용하고 있으면 최상위루트의 .eslintrc.js 파일에 globals 붙여넣기

module.exports = {
  globals: {
    "$": true,
    "jQuery": true
  },
  ...

 

위 솔루션은

https://maketips.net/tip/223/how-to-include-jquery-into-vuejs 여기 참고하여 해결함ㅠㅠㅠ