mirror of
https://github.com/yeicor-3d/yet-another-cad-viewer.git
synced 2025-12-19 22:24:17 +01:00
optimize build size 2
This commit is contained in:
@@ -26,10 +26,5 @@
|
|||||||
"@types/three": "^0.160.0",
|
"@types/three": "^0.160.0",
|
||||||
"buffer": "^5.5.0||^6.0.0",
|
"buffer": "^5.5.0||^6.0.0",
|
||||||
"parcel": "^2.11.0"
|
"parcel": "^2.11.0"
|
||||||
},
|
}
|
||||||
"browserslist": [
|
|
||||||
"> 0.5%",
|
|
||||||
"last 2 versions",
|
|
||||||
"not dead"
|
|
||||||
]
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -35,7 +35,7 @@ let modelViewerInfo: Ref<typeof ModelViewerInfo | null> = ref(null);
|
|||||||
console.log('Model-Viewer finished loading:', args)
|
console.log('Model-Viewer finished loading:', args)
|
||||||
modelViewerInfo = args
|
modelViewerInfo = args
|
||||||
}"/>
|
}"/>
|
||||||
<model-viewer-overlay/>
|
<model-viewer-overlay v-if="modelViewerInfo"/>
|
||||||
</v-main>
|
</v-main>
|
||||||
<!-- The left collapsible sidebar has the list of models -->
|
<!-- The left collapsible sidebar has the list of models -->
|
||||||
<sidebar :opened-init="openSidebarsDefault" side="left">
|
<sidebar :opened-init="openSidebarsDefault" side="left">
|
||||||
@@ -63,8 +63,11 @@ let modelViewerInfo: Ref<typeof ModelViewerInfo | null> = ref(null);
|
|||||||
|
|
||||||
<!--suppress CssUnusedSymbol -->
|
<!--suppress CssUnusedSymbol -->
|
||||||
<style>
|
<style>
|
||||||
html, body, #app, #main {
|
html, body, #main {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
|
|||||||
@@ -1,18 +0,0 @@
|
|||||||
<script setup lang="ts">
|
|
||||||
import ModelViewerOverlay from "./ModelViewerOverlay.vue";
|
|
||||||
import Loading from "./Loading.vue";
|
|
||||||
import {defineAsyncComponent} from "vue";
|
|
||||||
|
|
||||||
// NOTE: The ModelViewer library is big, so we split it and import it asynchronously
|
|
||||||
const ModelViewerWrapper = defineAsyncComponent({
|
|
||||||
loader: () => import('./ModelViewerWrapper.vue'),
|
|
||||||
loadingComponent: Loading,
|
|
||||||
delay: 0,
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
</style>
|
|
||||||
@@ -26,7 +26,7 @@
|
|||||||
top: 0;
|
top: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100vh;
|
height: 100dvh;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -59,7 +59,7 @@ function updateGizmo() {
|
|||||||
|
|
||||||
let reinstall = () => {
|
let reinstall = () => {
|
||||||
if (gizmo) container.value.removeChild(gizmo);
|
if (gizmo) container.value.removeChild(gizmo);
|
||||||
gizmo = createGizmo(container.value, props.scene) as typeof gizmo;
|
gizmo = createGizmo(container.value, props.scene as ModelScene) as typeof gizmo;
|
||||||
container.value.appendChild(gizmo);
|
container.value.appendChild(gizmo);
|
||||||
requestIdleCallback(updateGizmo); // Low priority updates
|
requestIdleCallback(updateGizmo); // Low priority updates
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -8,6 +8,7 @@ const props = defineProps({
|
|||||||
|
|
||||||
function toggleProjection() {
|
function toggleProjection() {
|
||||||
if (!props.modelViewerInfo) return;
|
if (!props.modelViewerInfo) return;
|
||||||
|
console.log('Toggling projection', props.modelViewerInfo);
|
||||||
}
|
}
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@@ -7,6 +7,5 @@
|
|||||||
<script type="module" src="./index.ts"></script>
|
<script type="module" src="./index.ts"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="app"></div>
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
@@ -8,8 +8,6 @@ import {createApp} from 'vue'
|
|||||||
import App from './App.vue'
|
import App from './App.vue'
|
||||||
|
|
||||||
import {createVuetify} from 'vuetify';
|
import {createVuetify} from 'vuetify';
|
||||||
import 'vuetify/lib/styles/main.sass';
|
|
||||||
import '@mdi/font/css/materialdesignicons.css'
|
|
||||||
import * as directives from 'vuetify/lib/directives';
|
import * as directives from 'vuetify/lib/directives';
|
||||||
|
|
||||||
const vuetify = createVuetify({
|
const vuetify = createVuetify({
|
||||||
@@ -23,3 +21,7 @@ const app = createApp(App)
|
|||||||
app.use(vuetify)
|
app.use(vuetify)
|
||||||
// noinspection JSUnresolvedReference
|
// noinspection JSUnresolvedReference
|
||||||
app.mount('body')
|
app.mount('body')
|
||||||
|
|
||||||
|
// Start non-blocking loading of Vuetify and icon styles
|
||||||
|
import('vuetify/lib/styles/main.sass');
|
||||||
|
import('@mdi/font/css/materialdesignicons.css');
|
||||||
3
src/shims.d.ts
vendored
3
src/shims.d.ts
vendored
@@ -1,3 +1,6 @@
|
|||||||
// Avoids typescript error when importing files
|
// Avoids typescript error when importing files
|
||||||
declare module '*.vue'
|
declare module '*.vue'
|
||||||
declare module 'three-orientation-gizmo/src/OrientationGizmo'
|
declare module 'three-orientation-gizmo/src/OrientationGizmo'
|
||||||
|
declare module 'vuetify/lib/styles/main.sass'
|
||||||
|
declare module '@mdi/font/css/materialdesignicons.css'
|
||||||
|
declare module 'vuetify/lib/directives'
|
||||||
Reference in New Issue
Block a user