App.vue
main.js
 
<template>
  <h1>Lifecycle Hook 'beforeCreate' Example</h1>
  <p>Using the beforeCreate lifecycle hook to create an alert, write to the console, and unsuccessfully trying to change the 'text' data property.</p>
  <p>'{{ text }}'</p>
</template>

<script>
export default {
  data() {
    return {
      text: 'initial text'
    }
  },
  beforeCreate(){
    console.log('beforeCreate lifecycle hook');
    alert('beforeCreate lifecycle hook');
    this.text = 'beforeCreate lifecycle hook'; // Does not work
  }
}
</script>                  
import { createApp } from 'vue'

import App from './App.vue'

const app = createApp(App)
app.mount('#app')
                  
http://localhost:5173/