feat: initial vue support

d5725652 · João Magalhães · 99c357d3 · d5725652 · d5725652 · d5725652
Verified Commit d5725652 authored 2 years ago by João Magalhães
--- a/examples/web/index.html
+++ b/examples/web/index.html
@@ -13,6 +13,7 @@
 </head>

 <body>
+    <div id="app"></div>
    <div class="main">
        <div class="side-left">
            <div id="canvas-container" class="canvas-container">

--- a/examples/web/index.ts
+++ b/examples/web/index.ts
--- a/examples/web/package.json
+++ b/examples/web/package.json
@@ -17,8 +17,10 @@
    "source": "index.ts",
    "devDependencies": {
        "@parcel/transformer-typescript-tsc": "^2.6.2",
+        "@parcel/transformer-vue": "^2.6.2",
        "parcel": "^2.6.2",
        "prettier": "^2.7.1",
-        "typescript": "^4.7.4"
+        "typescript": "^4.7.4",
+        "vue": "^3.2.37"
    }
 }
--- a/examples/web/tsconfig.json
+++ b/examples/web/tsconfig.json
@@ -6,6 +6,12 @@
        "allowSyntheticDefaultImports": true,
        "target": "es6",
        "noImplicitAny": true,
+        "noImplicitThis": true,
+        "alwaysStrict": true,
+        "strictBindCallApply": true,
+        "strictNullChecks": true,
+        "strictFunctionTypes": true,
+        "strictPropertyInitialization": true,
        "sourceMap": true,
        "outDir": ".",
        "baseUrl": ".",

--- a/examples/web/vue/app.vue
+++ b/examples/web/vue/app.vue
+<template>
+    <div v-bind:class="'hello'" v-on:click="() => count++">Hello This {{ name }} {{ count}}!</div>
+</template>
+
+<style scoped>
+.hello {
+    cursor: pointer;
+    user-select: none;
+}
+</style>
+
+<script>
+export const App = {
+    data() {
+        return {
+            name: "Vue",
+            count: 1
+        };
+    }
+};
+
+export default App;
+</script>
--- a/examples/web/vue/components/button.vue
+++ b/examples/web/vue/components/button.vue
+<template>
+    <div v-on:click="() => count++">Hello {{ name }} {{ count}}!</div>
+</template>
+
+<script>
+export const Button = {
+    data() {
+        return {
+            name: "Vue",
+            count: 1
+        };
+    }
+};
+
+export default Button;
+</script>