# @bagelink/vue

Features:

- Build with [unbuild](https://github.com/unjs/unbuild)
- File-to-file transpilation via [mkdist](https://github.com/unjs/mkdist)
- Playground with [vite](https://vitejs.dev/)

## Usage

Use component globally

```ts
// src/main.ts
import { createApp } from 'vue';
import { BagelVue } from '@bagel/vue';

import App from './App.vue';

const BagelConfig = {
  host: import.meta.env.VITE_BAGEL_BASE_URL,
  fileBaseUrl: import.meta.env.VITE_BAGEL_FILE_BASE_URL,
  onError: (err: any) => {
    // handle error
    // example:
    // useToast().error(`${$t('anErrorOccurred')}: ${err?.response?.data?.detail || err.message}`);
  },
};

const app = createApp(App);
app.use(head as Plugin);

app.mount('#app');
```

Import component

```vue
<script setup lang="ts">
import { useBagel } from '@bagel/vue';

const bagel = useBagel();
</script>

<!-- OR -->
<script lang="ts">
export default defineComponent({
  onMounted() {
    console.log(this.$bagel.host)
  },
});
</script>

<!-- OR -->
<template>
	<div>
		{{ $bagel.host }}
	</div>
</template>
```


## License

MIT
