title: Cannot use Options API in Vue 3 with Webpack
body: <p>I have a question about the Options API in Vue 3 which might be specific to my implementation with Webpack 5. From the docs and articles it seems that in Vue 3 you can use both the 'old' Options API and the 'new' Composition API interchangeably in Vue 3.</p>
  <p>However when I have the following code in my Vue 3 app:</p>
  <pre><code>&lt;template&gt;
    &lt;div class=&quot;blog-overview__filters&quot;&gt;
      &lt;button @click=&quot;filter()&quot; class=&quot;filter filter__option&quot;&gt;Click me&lt;/button&gt;
    &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  export default {
    name: &quot;Filters&quot;,
    methods: {
      filter() {
        console.log('Hello')
      }
    }
  };
  &lt;/script&gt;
  </code></pre>
  <p>I get the following warnings:
  <code>Unhandled error during execution of native event handler</code>
  <code>$options.filter is not a function</code></p>
  <p>When I use the setup function for the Composition API it works properly:</p>
  <pre><code>export default {
    name: &quot;Filters&quot;,
    setup() {
      const filter = () =&gt; {
        console.log('Hello')
      }
      return {
        filter
      }
    }
  };
  </code></pre>
  <p>The same goes for other Options API methods.</p>
  <p>The below Options API code does nothing in Vue 3:</p>
  <pre><code>export default {
    name: &quot;Blogs&quot;,
    data() {
      return {
        blogs: [],
      };
    },
    created() {
      let endpoint = &quot;endpoints/blog-overview.json&quot;;
      axios
        .get(endpoint)
        .then((res) =&gt; {
          this.blogs = res.data.blogs;
        })
        .catch((err) =&gt; {
          console.log({ err });
        });
    },
  };
  </code></pre>
  <p>But the Composition API works just fine:</p>
  <pre><code>import { onMounted, ref } from &quot;vue&quot;;
  
  export default {
    name: &quot;Blogs&quot;,
    setup() {
      const blogs = ref([]);
      onMounted(() =&gt; {
        let endpoint = &quot;endpoints/blog-overview.json&quot;;
        axios
          .get(endpoint)
          .then((res) =&gt; {
            blogs.value = res.data.blogs;
          })
          .catch((err) =&gt; {
            console.log({ err });
          });
      });
      
      return {
        blogs
      }
    },
  };
  </code></pre>
  <p>Are we not supposed to be able to continue using the Options API in Vue 3?</p>
  <p>My setup is:
  <code>webpack: 5.65.0</code>
  <code>vue: 3.2.26</code>
  <code>vue-loader: 17.0.0</code>
  <code>@vue/compiler-sfc: 3.2.26</code></p>