threepipe
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

index.html 1.4KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Threepipe React/TSX Sample</title>
  6. <!-- Import maps polyfill -->
  7. <!-- Remove this when import maps will be widely supported -->
  8. <script async src="https://unpkg.com/es-module-shims@1.6.3/dist/es-module-shims.js"></script>
  9. <script type="importmap">
  10. {
  11. "imports": {
  12. "threepipe": "./../../dist/index.mjs",
  13. "vue": "https://unpkg.com/vue@3/dist/vue.esm-browser.prod.js",
  14. "vue-import": "https://unpkg.com/vue-import/dist/vue-import.esm-browser.js"
  15. }
  16. }
  17. </script>
  18. <!-- "vue-import": "./vue-import/dist/vue-import.esm-browser.prod.js"-->
  19. <style>
  20. html, body{
  21. width: 100%;
  22. height: 100%;
  23. margin: 0;
  24. overflow: hidden;
  25. }
  26. </style>
  27. <script type="module" src="../examples-utils/global-loading.mjs"></script>
  28. <script type="module" src="../examples-utils/simple-code-preview.mjs"></script>
  29. </head>
  30. <body>
  31. <div id="app">
  32. <three-viewer></three-viewer>
  33. </div>
  34. <script type="module" data-scripts="./script.vue" id="example-script">
  35. import { createApp } from 'vue';
  36. import vueImport from 'vue-import';
  37. (async ()=>{
  38. const app = createApp();
  39. app.component('three-viewer', await vueImport('script.vue', {}))
  40. app.mount('#app');
  41. })()
  42. </script>
  43. </body>
  44. </html>