trent_larson
/
world-component
4
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Stable (?) stub

master
Matthew Raymer 1 year ago
parent
90f27e270c
commit
2e164affb8
8 changed files with 60 additions and 80 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      index.html
  2. 23
      package-lock.json
  3. 4
      package.json
  4. 30
      src/App.vue
  5. 29
      src/WorldComponent.vue
  6. 38
      src/components/HelloWorld.vue
  7. 4
      src/main.ts
  8. 2
      tsconfig.json

2
index.html
View File

@ -4,7 +4,7 @@
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" /> <link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite + Vue + TS</title> <title>World Component</title>
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>

23
package-lock.json
View File

@ -8,13 +8,15 @@
"name": "world-component", "name": "world-component",
"version": "0.0.0", "version": "0.0.0",
"dependencies": { "dependencies": {
"vue": "^3.2.47" "three": "^0.153.0",
"vue": "^3.3.4",
"vue-facing-decorator": "^2.1.20"
}, },
"devDependencies": { "devDependencies": {
"@vitejs/plugin-vue": "^4.1.0", "@vitejs/plugin-vue": "^4.2.3",
"typescript": "^5.0.2", "typescript": "^5.1.5",
"vite": "^4.3.9", "vite": "^4.3.9",
"vue-tsc": "^1.4.2" "vue-tsc": "^1.8.3"
} }
}, },
"node_modules/@babel/parser": { "node_modules/@babel/parser": {
@ -784,6 +786,11 @@
"node": ">=0.10.0" "node": ">=0.10.0"
} }
}, },
"node_modules/three": {
"version": "0.153.0",
"resolved": "https://registry.npmjs.org/three/-/three-0.153.0.tgz",
"integrity": "sha512-OCP2/uQR6GcDpSLnJt/3a4mdS0kNWcbfUXIwLoEMgLzEUIVIYsSDwskpmOii/AkDM+BBwrl6+CKgrjX9+E2aWg=="
},
"node_modules/typescript": { "node_modules/typescript": {
"version": "5.1.5", "version": "5.1.5",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-5.1.5.tgz", "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.1.5.tgz",
@ -857,6 +864,14 @@
"@vue/shared": "3.3.4" "@vue/shared": "3.3.4"
} }
}, },
"node_modules/vue-facing-decorator": {
"version": "2.1.20",
"resolved": "https://registry.npmjs.org/vue-facing-decorator/-/vue-facing-decorator-2.1.20.tgz",
"integrity": "sha512-Xv987Q+XhhWTPXxzG4HllHxckMahV04wDcRebdd/AWlU/hYm7+tGRo2eD84mpl3rZLZQ74Cr41UlWbGbEQptNA==",
"peerDependencies": {
"vue": "^3.0.0"
}
},
"node_modules/vue-template-compiler": { "node_modules/vue-template-compiler": {
"version": "2.7.14", "version": "2.7.14",
"resolved": "https://registry.npmjs.org/vue-template-compiler/-/vue-template-compiler-2.7.14.tgz", "resolved": "https://registry.npmjs.org/vue-template-compiler/-/vue-template-compiler-2.7.14.tgz",

4
package.json
View File

@ -9,7 +9,9 @@
"preview": "vite preview" "preview": "vite preview"
}, },
"dependencies": { "dependencies": {
"vue": "^3.3.4" "three": "^0.153.0",
"vue": "^3.3.4",
"vue-facing-decorator": "^2.1.20"
}, },
"devDependencies": { "devDependencies": {
"@vitejs/plugin-vue": "^4.2.3", "@vitejs/plugin-vue": "^4.2.3",

30
src/App.vue
View File

@ -1,30 +0,0 @@
<script setup lang="ts">
import HelloWorld from './components/HelloWorld.vue'
</script>
<template>
<div>
<a href="https://vitejs.dev" target="_blank">
<img src="/vite.svg" class="logo" alt="Vite logo" />
</a>
<a href="https://vuejs.org/" target="_blank">
<img src="./assets/vue.svg" class="logo vue" alt="Vue logo" />
</a>
</div>
<HelloWorld msg="Vite + Vue" />
</template>
<style scoped>
.logo {
height: 6em;
padding: 1.5em;
will-change: filter;
transition: filter 300ms;
}
.logo:hover {
filter: drop-shadow(0 0 2em #646cffaa);
}
.logo.vue:hover {
filter: drop-shadow(0 0 2em #42b883aa);
}
</style>

29
src/WorldComponent.vue
View File

@ -0,0 +1,29 @@
<template>
<div>
</div>
</template>
<script lang="ts">
import { Component, Vue } from 'vue-facing-decorator';
@Component
export default class WorldComponent extends Vue {
}
</script>
<style scoped>
.logo {
height: 6em;
padding: 1.5em;
will-change: filter;
transition: filter 300ms;
}
.logo:hover {
filter: drop-shadow(0 0 2em #646cffaa);
}
.logo.vue:hover {
filter: drop-shadow(0 0 2em #42b883aa);
}
</style>

38
src/components/HelloWorld.vue
View File

@ -1,38 +0,0 @@
<script setup lang="ts">
import { ref } from 'vue'
defineProps<{ msg: string }>()
const count = ref(0)
</script>
<template>
<h1>{{ msg }}</h1>
<div class="card">
<button type="button" @click="count++">count is {{ count }}</button>
<p>
Edit
<code>components/HelloWorld.vue</code> to test HMR
</p>
</div>
<p>
Check out
<a href="https://vuejs.org/guide/quick-start.html#local" target="_blank"
>create-vue</a
>, the official Vue + Vite starter
</p>
<p>
Install
<a href="https://github.com/vuejs/language-tools" target="_blank">Volar</a>
in your IDE for a better DX
</p>
<p class="read-the-docs">Click on the Vite and Vue logos to learn more</p>
</template>
<style scoped>
.read-the-docs {
color: #888;
}
</style>

4
src/main.ts
View File

@ -1,5 +1,5 @@
import { createApp } from 'vue' import { createApp } from 'vue'
import './style.css' import './style.css'
import App from './App.vue' import WorldComponent from './WorldComponent.vue'
createApp(App).mount('#app') createApp(WorldComponent).mount('#app')

2
tsconfig.json
View File

@ -5,6 +5,8 @@
"module": "ESNext", "module": "ESNext",
"lib": ["ES2020", "DOM", "DOM.Iterable"], "lib": ["ES2020", "DOM", "DOM.Iterable"],
"skipLibCheck": true, "skipLibCheck": true,
"experimentalDecorators": true,
/* Bundler mode */ /* Bundler mode */
"moduleResolution": "bundler", "moduleResolution": "bundler",

Write Preview
Loading…
Cancel
Save