Vue components in shopify with liquid

I am working in shopify and they use liquid so I am importing vue over a cdn

I have the following code:

function collectionApp() {
  const { createApp } = Vue
  const collection_vm = createApp({}).mount('#collection')

   Vue.component('button-counter', {
     data() {
       return {
          count: 0
      template: `
         <button @click="count++">{{ count }}</button>

document.addEventListener('DOMContentLoaded', e => {

<div id="collection">

With the above code nothing happens, I don’t know if I am doing this wrong or if it is because shopify is server side rendered.