This commit is contained in:
Kumkwats 2022-09-29 10:50:52 +02:00
parent 2172cb8bad
commit 389b8ade80
6 changed files with 249 additions and 13 deletions

160
www/package-lock.json generated
View File

@ -8,13 +8,17 @@
"name": "www",
"version": "1.0.0",
"dependencies": {
"sirv-cli": "^2.0.0"
"@threlte/core": "^4.3.2",
"@threlte/extras": "^4.3.0",
"sirv-cli": "^2.0.0",
"three": "^0.145.0"
},
"devDependencies": {
"@rollup/plugin-commonjs": "^17.0.0",
"@rollup/plugin-node-resolve": "^11.0.0",
"@rollup/plugin-typescript": "^8.0.0",
"@tsconfig/svelte": "^2.0.0",
"@types/three": "^0.144.0",
"rollup": "^2.3.4",
"rollup-plugin-css-only": "^3.1.0",
"rollup-plugin-livereload": "^2.0.0",
@ -247,6 +251,19 @@
"integrity": "sha512-1fMXF3YP4pZZVozF8j/ZLfvnR8NSIljt56UhbZ5PeeDmmGHpgpdwQt7ITlGvYaQukCvuBRMLEiKiYC+oeIg4cg==",
"dev": true
},
"node_modules/@threlte/core": {
"version": "4.3.2",
"resolved": "https://registry.npmjs.org/@threlte/core/-/core-4.3.2.tgz",
"integrity": "sha512-CiXT8CCpqxg0Ss15xn2fpJtMGtXxH1hKjhkf/zfETdU/ZtkuPSMQxnuE7exnXMySHsccmyGH66o1cgKZZ1UE4A=="
},
"node_modules/@threlte/extras": {
"version": "4.3.0",
"resolved": "https://registry.npmjs.org/@threlte/extras/-/extras-4.3.0.tgz",
"integrity": "sha512-9C6A+dGuaL0AWfxfARAa7Y07khAtfZQ5a3tkd+lbJLhIjO0XO6ESKTXfPJlRPurUPS7Tlmuu+Uw/xo3QlbZ2/g==",
"dependencies": {
"troika-three-text": "^0.46.4"
}
},
"node_modules/@tsconfig/svelte": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/@tsconfig/svelte/-/svelte-2.0.1.tgz",
@ -289,6 +306,21 @@
"@types/node": "*"
}
},
"node_modules/@types/three": {
"version": "0.144.0",
"resolved": "https://registry.npmjs.org/@types/three/-/three-0.144.0.tgz",
"integrity": "sha512-psvEs6q5rLN50jUYZ3D4pZMfxTbdt3A243blt0my7/NcL6chaCZpHe2csbCtx0SOD9fI/XnF3wnVUAYZGqCSYg==",
"dev": true,
"dependencies": {
"@types/webxr": "*"
}
},
"node_modules/@types/webxr": {
"version": "0.5.0",
"resolved": "https://registry.npmjs.org/@types/webxr/-/webxr-0.5.0.tgz",
"integrity": "sha512-IUMDPSXnYIbEO2IereEFcgcqfDREOgmbGqtrMpVPpACTU6pltYLwHgVkrnYv0XhWEcjio9sYEfIEzgn3c7nDqA==",
"dev": true
},
"node_modules/acorn": {
"version": "8.8.0",
"resolved": "https://registry.npmjs.org/acorn/-/acorn-8.8.0.tgz",
@ -332,6 +364,14 @@
"integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
"dev": true
},
"node_modules/bidi-js": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/bidi-js/-/bidi-js-1.0.2.tgz",
"integrity": "sha512-rzSy/k7WdX5zOyeHHCOixGXbCHkyogkxPKL2r8QtzHmVQDiWCXUWa18bLdMWT9CYMLOYTjWpTHawuev2ouYJVw==",
"dependencies": {
"require-from-string": "^2.0.2"
}
},
"node_modules/binary-extensions": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz",
@ -1034,6 +1074,14 @@
"node": ">=8.10.0"
}
},
"node_modules/require-from-string": {
"version": "2.0.2",
"resolved": "https://registry.npmjs.org/require-from-string/-/require-from-string-2.0.2.tgz",
"integrity": "sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw==",
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/require-relative": {
"version": "0.8.7",
"resolved": "https://registry.npmjs.org/require-relative/-/require-relative-0.8.7.tgz",
@ -1498,6 +1546,11 @@
"node": ">=10"
}
},
"node_modules/three": {
"version": "0.145.0",
"resolved": "https://registry.npmjs.org/three/-/three-0.145.0.tgz",
"integrity": "sha512-EKoHQEtEJ4CB6b2BGMBgLZrfwLjXcSUfoI/MiIXUuRpeYsfK5aPWbYhdtIVWOH+x6X0TouldHKHBuc/LAiFzAw=="
},
"node_modules/tinydate": {
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/tinydate/-/tinydate-1.3.0.tgz",
@ -1526,6 +1579,33 @@
"node": ">=6"
}
},
"node_modules/troika-three-text": {
"version": "0.46.4",
"resolved": "https://registry.npmjs.org/troika-three-text/-/troika-three-text-0.46.4.tgz",
"integrity": "sha512-Qsv0HhUKTZgSmAJs5wvO7YlBoJSP9TGPLmrg+K9pbQq4lseQdcevbno/WI38bwJBZ/qS56hvfqEzY0zUEFzDIw==",
"dependencies": {
"bidi-js": "^1.0.2",
"troika-three-utils": "^0.46.0",
"troika-worker-utils": "^0.46.0",
"webgl-sdf-generator": "1.1.1"
},
"peerDependencies": {
"three": ">=0.103.0"
}
},
"node_modules/troika-three-utils": {
"version": "0.46.0",
"resolved": "https://registry.npmjs.org/troika-three-utils/-/troika-three-utils-0.46.0.tgz",
"integrity": "sha512-llHyrXAcwzr0bpg80GxsIp73N7FuImm4WCrKDJkAqcAsWmE5pfP9+Qzw+oMWK1P/AdHQ79eOrOl9NjyW4aOw0w==",
"peerDependencies": {
"three": ">=0.103.0"
}
},
"node_modules/troika-worker-utils": {
"version": "0.46.0",
"resolved": "https://registry.npmjs.org/troika-worker-utils/-/troika-worker-utils-0.46.0.tgz",
"integrity": "sha512-bzOx5f2ZBxkFhXtIvDJlLn2AI3bzCkGVbCndl/2dL5QZrwHEKl45OEIilCxYQQWJG1rEbOD9O80tMjoYjw19OA=="
},
"node_modules/tslib": {
"version": "2.4.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.4.0.tgz",
@ -1545,6 +1625,11 @@
"node": ">=4.2.0"
}
},
"node_modules/webgl-sdf-generator": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/webgl-sdf-generator/-/webgl-sdf-generator-1.1.1.tgz",
"integrity": "sha512-9Z0JcMTFxeE+b2x1LJTdnaT8rT8aEp7MVxkNwoycNmJWwPdzoXzMh0BjJSh/AEFP+KPYZUli814h8bJZFIZ2jA=="
},
"node_modules/wrappy": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
@ -1738,6 +1823,19 @@
}
}
},
"@threlte/core": {
"version": "4.3.2",
"resolved": "https://registry.npmjs.org/@threlte/core/-/core-4.3.2.tgz",
"integrity": "sha512-CiXT8CCpqxg0Ss15xn2fpJtMGtXxH1hKjhkf/zfETdU/ZtkuPSMQxnuE7exnXMySHsccmyGH66o1cgKZZ1UE4A=="
},
"@threlte/extras": {
"version": "4.3.0",
"resolved": "https://registry.npmjs.org/@threlte/extras/-/extras-4.3.0.tgz",
"integrity": "sha512-9C6A+dGuaL0AWfxfARAa7Y07khAtfZQ5a3tkd+lbJLhIjO0XO6ESKTXfPJlRPurUPS7Tlmuu+Uw/xo3QlbZ2/g==",
"requires": {
"troika-three-text": "^0.46.4"
}
},
"@tsconfig/svelte": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/@tsconfig/svelte/-/svelte-2.0.1.tgz",
@ -1780,6 +1878,21 @@
"@types/node": "*"
}
},
"@types/three": {
"version": "0.144.0",
"resolved": "https://registry.npmjs.org/@types/three/-/three-0.144.0.tgz",
"integrity": "sha512-psvEs6q5rLN50jUYZ3D4pZMfxTbdt3A243blt0my7/NcL6chaCZpHe2csbCtx0SOD9fI/XnF3wnVUAYZGqCSYg==",
"dev": true,
"requires": {
"@types/webxr": "*"
}
},
"@types/webxr": {
"version": "0.5.0",
"resolved": "https://registry.npmjs.org/@types/webxr/-/webxr-0.5.0.tgz",
"integrity": "sha512-IUMDPSXnYIbEO2IereEFcgcqfDREOgmbGqtrMpVPpACTU6pltYLwHgVkrnYv0XhWEcjio9sYEfIEzgn3c7nDqA==",
"dev": true
},
"acorn": {
"version": "8.8.0",
"resolved": "https://registry.npmjs.org/acorn/-/acorn-8.8.0.tgz",
@ -1811,6 +1924,14 @@
"integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
"dev": true
},
"bidi-js": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/bidi-js/-/bidi-js-1.0.2.tgz",
"integrity": "sha512-rzSy/k7WdX5zOyeHHCOixGXbCHkyogkxPKL2r8QtzHmVQDiWCXUWa18bLdMWT9CYMLOYTjWpTHawuev2ouYJVw==",
"requires": {
"require-from-string": "^2.0.2"
}
},
"binary-extensions": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz",
@ -2345,6 +2466,11 @@
"picomatch": "^2.2.1"
}
},
"require-from-string": {
"version": "2.0.2",
"resolved": "https://registry.npmjs.org/require-from-string/-/require-from-string-2.0.2.tgz",
"integrity": "sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw=="
},
"require-relative": {
"version": "0.8.7",
"resolved": "https://registry.npmjs.org/require-relative/-/require-relative-0.8.7.tgz",
@ -2641,6 +2767,11 @@
"source-map-support": "~0.5.20"
}
},
"three": {
"version": "0.145.0",
"resolved": "https://registry.npmjs.org/three/-/three-0.145.0.tgz",
"integrity": "sha512-EKoHQEtEJ4CB6b2BGMBgLZrfwLjXcSUfoI/MiIXUuRpeYsfK5aPWbYhdtIVWOH+x6X0TouldHKHBuc/LAiFzAw=="
},
"tinydate": {
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/tinydate/-/tinydate-1.3.0.tgz",
@ -2660,6 +2791,28 @@
"resolved": "https://registry.npmjs.org/totalist/-/totalist-3.0.0.tgz",
"integrity": "sha512-eM+pCBxXO/njtF7vdFsHuqb+ElbxqtI4r5EAvk6grfAFyJ6IvWlSkfZ5T9ozC6xWw3Fj1fGoSmrl0gUs46JVIw=="
},
"troika-three-text": {
"version": "0.46.4",
"resolved": "https://registry.npmjs.org/troika-three-text/-/troika-three-text-0.46.4.tgz",
"integrity": "sha512-Qsv0HhUKTZgSmAJs5wvO7YlBoJSP9TGPLmrg+K9pbQq4lseQdcevbno/WI38bwJBZ/qS56hvfqEzY0zUEFzDIw==",
"requires": {
"bidi-js": "^1.0.2",
"troika-three-utils": "^0.46.0",
"troika-worker-utils": "^0.46.0",
"webgl-sdf-generator": "1.1.1"
}
},
"troika-three-utils": {
"version": "0.46.0",
"resolved": "https://registry.npmjs.org/troika-three-utils/-/troika-three-utils-0.46.0.tgz",
"integrity": "sha512-llHyrXAcwzr0bpg80GxsIp73N7FuImm4WCrKDJkAqcAsWmE5pfP9+Qzw+oMWK1P/AdHQ79eOrOl9NjyW4aOw0w==",
"requires": {}
},
"troika-worker-utils": {
"version": "0.46.0",
"resolved": "https://registry.npmjs.org/troika-worker-utils/-/troika-worker-utils-0.46.0.tgz",
"integrity": "sha512-bzOx5f2ZBxkFhXtIvDJlLn2AI3bzCkGVbCndl/2dL5QZrwHEKl45OEIilCxYQQWJG1rEbOD9O80tMjoYjw19OA=="
},
"tslib": {
"version": "2.4.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.4.0.tgz",
@ -2672,6 +2825,11 @@
"integrity": "sha512-goMHfm00nWPa8UvR/CPSvykqf6dVV8x/dp0c5mFTMTIu0u0FlGWRioyy7Nn0PGAdHxpJZnuO/ut+PpQ8UiHAig==",
"dev": true
},
"webgl-sdf-generator": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/webgl-sdf-generator/-/webgl-sdf-generator-1.1.1.tgz",
"integrity": "sha512-9Z0JcMTFxeE+b2x1LJTdnaT8rT8aEp7MVxkNwoycNmJWwPdzoXzMh0BjJSh/AEFP+KPYZUli814h8bJZFIZ2jA=="
},
"wrappy": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",

View File

@ -13,6 +13,9 @@
"devDependencies": {
"@rollup/plugin-commonjs": "^17.0.0",
"@rollup/plugin-node-resolve": "^11.0.0",
"@rollup/plugin-typescript": "^8.0.0",
"@tsconfig/svelte": "^2.0.0",
"@types/three": "^0.144.0",
"rollup": "^2.3.4",
"rollup-plugin-css-only": "^3.1.0",
"rollup-plugin-livereload": "^2.0.0",
@ -21,12 +24,16 @@
"svelte": "^3.0.0",
"svelte-check": "^2.0.0",
"svelte-preprocess": "^4.0.0",
"@rollup/plugin-typescript": "^8.0.0",
"typescript": "^4.0.0",
"tslib": "^2.0.0",
"@tsconfig/svelte": "^2.0.0"
"typescript": "^4.0.0"
},
"dependencies": {
"sirv-cli": "^2.0.0"
}
"@threlte/core": "^4.3.2",
"@threlte/extras": "^4.3.0",
"sirv-cli": "^2.0.0",
"three": "^0.145.0"
},
"main": "rollup.config.js",
"keywords": [],
"license": "ISC"
}

View File

@ -56,10 +56,11 @@ export default {
// consult the documentation for details:
// https://github.com/rollup/plugins/tree/master/packages/commonjs
resolve({
main: true,
browser: true,
dedupe: ['svelte']
}),
commonjs(),
commonjs({include: 'node_modules/**'}),
typescript({
sourceMap: !production,
inlineSources: !production

View File

@ -1,10 +1,10 @@
<script lang="ts">
export let name: string;
// export let name: string;
import Test3D from "./components/test3D.svelte";
</script>
<main>
<h1>Hello {name}!</h1>
<p>Visit the <a href="https://svelte.dev/tutorial">Svelte tutorial</a> to learn how to build Svelte apps.</p>
<Test3D></Test3D>
</main>
<style>

View File

@ -0,0 +1,70 @@
<script>
import {
CircleBufferGeometry,
MeshStandardMaterial,
BoxBufferGeometry,
DoubleSide,
} from "three";
import { DEG2RAD } from "three/src/math/MathUtils";
import {
AmbientLight,
Canvas,
DirectionalLight,
Group,
HemisphereLight,
Mesh,
OrbitControls,
PerspectiveCamera,
} from "@threlte/core";
import { spring } from "svelte/motion";
const scale = spring(1);
</script>
<div>
<Canvas>
<PerspectiveCamera position={{ x: 10, y: 10, z: 10 }} fov={24}>
<OrbitControls
maxPolarAngle={DEG2RAD * 80}
autoRotate={false}
enableZoom={false}
target={{ y: 0.5 }}
/>
</PerspectiveCamera>
<DirectionalLight shadow position={{ x: 3, y: 10, z: 10 }} />
<DirectionalLight position={{ x: -3, y: 10, z: -10 }} intensity={0.2} />
<AmbientLight intensity={0.2} />
<!-- Cube -->
<Group scale={$scale}>
<Mesh
interactive
on:pointerenter={() => ($scale = 2)}
on:pointerleave={() => ($scale = 1)}
position={{ y: 0.5 }}
castShadow
geometry={new BoxBufferGeometry(1, 1, 1)}
material={new MeshStandardMaterial({ color: "#333333" })}
/>
</Group>
<!-- Floor -->
<Mesh
receiveShadow
rotation={{ x: -90 * (Math.PI / 180) }}
geometry={new CircleBufferGeometry(3, 72)}
material={new MeshStandardMaterial({
side: DoubleSide,
color: "white",
})}
/>
</Canvas>
</div>
<style>
div {
height: 100%;
width: 100%;
}
</style>

View File

@ -2,9 +2,9 @@ import App from './App.svelte';
const app = new App({
target: document.body,
props: {
name: 'tout tout le monde'
}
// props: {
// name: 'tout tout le monde'
// }
});
export default app;