diff options
| author |  Matthew Phillips <matthew@skypack.dev>
| 2023-08-11 10:05:02 -0400 |
|---|---|---|
| committer |  GitHub <noreply@github.com>
| 2023-08-11 10:05:02 -0400 |
| commit | 519a1c4e8407c7abcb8d879b67a9f4b960652cae (patch) | |
| tree | 1d102fa0e3a64e885d9872c2ed944f76ca10a16c /examples/framework-multiple/src/components/vue | |
| parent | 2ee418e06ab1f7855dee0078afbad0b06de3b183 (diff) | |
| download | astro-519a1c4e8407c7abcb8d879b67a9f4b960652cae.tar.gz astro-519a1c4e8407c7abcb8d879b67a9f4b960652cae.tar.zst astro-519a1c4e8407c7abcb8d879b67a9f4b960652cae.zip | |
JSX refactor (#7924)
* JSX refactor
* Get preact/compat test to pass
* Use include config
* Remove old astro flavored markdown test
* Move babel dep to preact
* Remove errant debugger
* Update lockfile
* Update the multi-framework example
* Update e2e tests
* Fix nested-in-vue tests
* Add back in astro check
* Update packages/astro/src/core/create-vite.ts
Co-authored-by: Nate Moore <natemoo-re@users.noreply.github.com>
* Update packages/astro/src/core/create-vite.ts
Co-authored-by: Nate Moore <natemoo-re@users.noreply.github.com>
* Update packages/integrations/solid/src/index.ts
Co-authored-by: Nate Moore <natemoo-re@users.noreply.github.com>
* Update packages/integrations/solid/src/index.ts
Co-authored-by: Nate Moore <natemoo-re@users.noreply.github.com>
* Update .changeset/perfect-horses-tell.md
Co-authored-by: Nate Moore <natemoo-re@users.noreply.github.com>
* Move the comment about the include config
* Remove redundant alias config
* Use react's own preamble code
* Use the base for the preamble
* Remove solid redundancy
* Update .changeset/perfect-horses-tell.md
Co-authored-by: Sarah Rainsberger <sarah@rainsberger.ca>
* Update based on review comments
* Oops
---------
Co-authored-by: Fred K. Schott <fkschott@gmail.com>
Co-authored-by: Nate Moore <natemoo-re@users.noreply.github.com>
Co-authored-by: Sarah Rainsberger <sarah@rainsberger.ca>
Diffstat (limited to 'examples/framework-multiple/src/components/vue')
| -rw-r--r-- | examples/framework-multiple/src/components/vue/VueCounter.vue | 33 |
1 files changed, 33 insertions, 0 deletions
diff --git a/examples/framework-multiple/src/components/vue/VueCounter.vue b/examples/framework-multiple/src/components/vue/VueCounter.vue new file mode 100644 index 000000000..74820f7f0 --- /dev/null +++ b/examples/framework-multiple/src/components/vue/VueCounter.vue @@ -0,0 +1,33 @@ +<template> + <!-- + Seeing type errors on the word `class`? + This unfortunately happens because @types/react's JSX definitions leak into every file due to being declared globally. + There's currently no way to prevent this when using both Vue and React with TypeScript in the same project. + You can read more about this issue here: https://github.com/johnsoncodehk/volar/discussions/592 + --> + <div class="counter"> + <button @click="subtract()">-</button> + <pre>{{ count }}</pre> + <button @click="add()">+</button> + </div> + <div class="counter-message"> + <slot /> + </div> +</template> + +<script lang="ts"> +import { ref } from 'vue'; +export default { + setup() { + const count = ref(0); + const add = () => (count.value = count.value + 1); + const subtract = () => (count.value = count.value - 1); + + return { + count, + add, + subtract, + }; + }, +}; +</script> |