title: "Parsing error: Unexpected token < ..." using VueCli3 and airbnb eslint
body: <p>I know this may seem like a duplicate question, I still get this type of eslint errors after trying the following:</p>
  <ul>
  <li><p><a href="https://github.com/prettier/prettier/issues/3720" rel="nofollow noreferrer">https://github.com/prettier/prettier/issues/3720</a>  (i already installed eslint-plugin-vue)</p>
  </li>
  <li><p><a href="https://stackoverflow.com/questions/49129296/vue-js-eslint-parsing-error-unexpected-token">Vue.js eslint Parsing error .: unexpected token</a> (not really related to my question, but I tried it anyway)</p>
  </li>
  <li><p><a href="https://github.com/vuejs/eslint-plugin-vue/issues/186" rel="nofollow noreferrer">https://github.com/vuejs/eslint-plugin-vue/issues/186</a></p>
  </li>
  <li><p><a href="https://stackoverflow.com/questions/41854038/unexpected-token-for-vuejs-running-with-webpack">&quot;Unexpected token &lt;&quot; for VueJS running with Webpack</a></p>
  </li>
  </ul>
  <p>Here is part of my package.json setting:</p>
  <pre><code>&quot;devDependencies&quot;: {
      &quot;@vue/cli-plugin-babel&quot;: &quot;^3.0.5&quot;,
      &quot;@vue/cli-plugin-eslint&quot;: &quot;^3.0.5&quot;,
      &quot;@vue/cli-plugin-unit-jest&quot;: &quot;^3.0.5&quot;,
      &quot;@vue/cli-service&quot;: &quot;^3.0.5&quot;,
      &quot;@vue/eslint-config-airbnb&quot;: &quot;^4.0.0&quot;,
      &quot;@vue/test-utils&quot;: &quot;^1.0.0-beta.20&quot;,
      &quot;babel-core&quot;: &quot;7.0.0-bridge.0&quot;,
      &quot;babel-eslint&quot;: &quot;^10.0.1&quot;,
      &quot;babel-jest&quot;: &quot;^23.6.0&quot;,
      &quot;eslint&quot;: &quot;^5.8.0&quot;,
      &quot;eslint-config-airbnb-base&quot;: &quot;^13.1.0&quot;,
      &quot;eslint-plugin-import&quot;: &quot;^2.14.0&quot;,
      &quot;eslint-plugin-vue&quot;: &quot;^5.0.0-0&quot;,
      &quot;vue-template-compiler&quot;: &quot;^2.5.17&quot;
    },
    &quot;eslintConfig&quot;: {
      &quot;root&quot;: true,
      &quot;env&quot;: {
        &quot;node&quot;: true
      },
      &quot;extends&quot;: [
        &quot;plugin:vue/essential&quot;,
        &quot;@vue/airbnb&quot;
      ],
      &quot;rules&quot;: {},
      &quot;parserOptions&quot;: {
        &quot;parser&quot;: &quot;babel-eslint&quot;,
        &quot;ecmaVersion&quot;: 6
      }
    },
  </code></pre>
  <p>Here is my <code>.eslintrc.js</code> file:</p>
  <pre><code>module.exports = {
    parserOptions: {
      sourceType: 'module',
      allowImportExportEverywhere: true,
    },
    rules: {
      'no-console': 0,
    },
    plugins: ['vue'],
  };
  </code></pre>
  <p>Here is a detailed version of eslint error:</p>
  <pre><code>error: Parsing error: Unexpected token &lt; at src/App.vue:1:1:
  &gt; 1 | &lt;template&gt;
      | ^
    2 |   &lt;div id=&quot;app&quot;&gt;
    3 |     &lt;router-view/&gt;
    4 |   &lt;/div&gt;
  </code></pre>
  <p>Here is my App.vue source code:</p>
  <pre><code>&lt;template&gt;
    &lt;div id=&quot;app&quot;&gt;
      &lt;router-view/&gt;
    &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  export default {
    name: 'BuilderApp',
    data() {
      return {
        dragEvents: ['drag', 'dragstart', 'dragend', 'dragover', 'dragenter', 'dragleave', 'drop'],
      };
    },
    mounted() {
      // prevent default action for all defined dragEvents
      if (this.dragAndDropCapable()) {
        this.dragEvents.forEach((dragEvent) =&gt; {
          document.getElementById('app').addEventListener(dragEvent, (e) =&gt; {
            e.preventDefault();
            e.stopPropagation();
          }, false);
        });
      }
    },
    methods: {
      dragAndDropCapable() {
        const testDiv = document.createElement('div');
        return (('draggable' in testDiv)
            || ('ondragstart' in testDiv &amp;&amp; 'ondrop' in testDiv))
            &amp;&amp; 'FormData' in window
            &amp;&amp; 'FileReader' in window;
      },
    },
  };
  &lt;/script&gt;
  
  &lt;style&gt;
  .filter-disable .filter-count {
    background: #dadada;
  }
  &lt;/style&gt;
  </code></pre>
  <p>I'm not sure what I am missing.</p>