@glossarist/concept-browser 0.7.22 → 0.7.24

package/src/stores/vocabulary.ts

@@ -1,11 +1,12 @@
 import { defineStore } from 'pinia';
-import { ref, computed, toRaw } from 'vue';
+import { ref, shallowRef, computed } from 'vue';
 import { getFactory } from '../adapters/factory';
 import type { DatasetAdapter } from '../adapters/DatasetAdapter';
 import type { Manifest, SearchHit, GraphEdge } from '../adapters/types';
 import type { Concept } from 'glossarist';
 import { conceptUri } from '../adapters/model-bridge';
 import { GraphEngine } from '../graph';
+import { deduplicateSearchHits } from '../utils/search';
 
 export const useVocabularyStore = defineStore('vocabulary', () => {
   // State
@@ -16,7 +17,7 @@ export const useVocabularyStore = defineStore('vocabulary', () => {
   const currentConceptId = ref<string>('');
   const loading = ref(false);
   const error = ref<string | null>(null);
-  const graph = ref(new GraphEngine());
+  const graph = shallowRef(new GraphEngine());
   const conceptEdges = ref<GraphEdge[]>([]);
   const initialized = ref(false);
 
@@ -76,75 +77,19 @@ export const useVocabularyStore = defineStore('vocabulary', () => {
         manifests.value.set(registerId, adapter.manifest);
       }
 
-      // Load pre-computed edges (lightweight)
-      await loadEdges(adapter);
-
       touchGraph();
-
-      // Seed graph nodes lazily — don't block UI for large datasets
-      seedGraphNodes(registerId, adapter);
     } catch (e: unknown) {
       error.value = `Failed to load dataset ${registerId}: ${e instanceof Error ? e.message : String(e)}`;
       throw e;
     }
   }
 
-  function seedGraphNodes(registerId: string, adapter: DatasetAdapter, sync = false) {
-    const entries = adapter.getConcepts();
-
-    if (sync) {
-      for (const entry of entries) {
-        if (!entry) continue;
-        graph.value.addNode({
-          uri: factory.router.buildUri(registerId, entry.id),
-          register: registerId,
-          conceptId: entry.id,
-          designations: entry.designations,
-          status: entry.status,
-          loaded: false,
-        });
-      }
-      touchGraph();
-      return;
-    }
-
-    const batchSize = 500;
-    let offset = 0;
-    const schedule = typeof requestIdleCallback !== 'undefined'
-      ? requestIdleCallback
-      : (cb: () => void) => setTimeout(cb, 0);
-
-    function processBatch() {
-      const end = Math.min(offset + batchSize, entries.length);
-      for (let i = offset; i < end; i++) {
-        const entry = entries[i];
-        if (!entry) continue;
-        graph.value.addNode({
-          uri: factory.router.buildUri(registerId, entry.id),
-          register: registerId,
-          conceptId: entry.id,
-          designations: entry.designations,
-          status: entry.status,
-          loaded: false,
-        });
-      }
-      offset = end;
-      if (offset < entries.length) {
-        schedule(processBatch);
-      } else {
-        touchGraph();
-      }
-    }
-
-    schedule(processBatch);
-  }
-
   async function loadAllGraphData() {
     if (!initialized.value) {
       await discoverDatasets();
     }
 
-    const engine = toRaw(graph.value);
+    const engine = graph.value;
     const adapters = factory.getAdapters();
 
     await Promise.allSettled(adapters.map(async (adapter) => {
@@ -197,11 +142,12 @@ export const useVocabularyStore = defineStore('vocabulary', () => {
         adapter.loadEdgeIndex(),
         adapter.loadDomainNodes(),
       ]);
+      const engine = graph.value;
       for (const dn of domainNodes) {
-        graph.value.addNode(dn);
+        engine.addNode(dn);
       }
       for (const edge of edges) {
-        graph.value.addEdge(edge);
+        engine.addEdge(edge);
       }
       edgeStatus.value[adapter.registerId] = { loaded: true, count: edges.length };
     } catch {
@@ -209,19 +155,19 @@ export const useVocabularyStore = defineStore('vocabulary', () => {
     }
   }
 
-  async function ensureAllEdgesLoaded() {
-    for (const [id, adapter] of datasets.value) {
-      if (!edgeStatus.value[id]?.loaded) {
-        try {
-          const edges = await adapter.loadEdgeIndex();
-          for (const edge of edges) {
-            graph.value.addEdge(edge);
-          }
-          edgeStatus.value[id] = { loaded: true, count: edges.length };
-        } catch {
-          edgeStatus.value[id] = { loaded: false, count: 0 };
-        }
-      }
+  async function ensureEdgesForDataset(registerId: string) {
+    const adapter = datasets.value.get(registerId);
+    if (adapter && !edgeStatus.value[registerId]?.loaded) {
+      await loadEdges(adapter);
+    }
+
+    const index = await factory.loadCrossRefIndex();
+    const refs = index[registerId] || [];
+    for (const refId of refs) {
+      if (edgeStatus.value[refId]?.loaded) continue;
+      const refAdapter = datasets.value.get(refId);
+      if (!refAdapter) continue;
+      await loadEdges(refAdapter);
     }
   }
 
@@ -234,16 +180,18 @@ export const useVocabularyStore = defineStore('vocabulary', () => {
       const adapter = datasets.value.get(registerId);
       if (!adapter) throw new Error(`Dataset ${registerId} not loaded`);
 
-      const concept = await adapter.fetchConcept(conceptId);
+      // Fetch concept and cross-dataset edges in parallel
+      const [concept] = await Promise.all([
+        adapter.fetchConcept(conceptId),
+        ensureEdgesForDataset(registerId),
+      ]);
       currentConcept.value = concept;
 
-      // Extract and register edges for this specific concept
       const edges = adapter.extractEdges(concept);
       const domainEdges = adapter.extractDomainEdges(concept);
       const uriBase = adapter.manifest?.uriBase || 'https://glossarist.org';
       const uri = conceptUri(concept, registerId, uriBase);
 
-      // Update graph node with full data
       const designations: Record<string, string> = {};
       const indexEntry = adapter.getIndexEntry(conceptId);
       if (indexEntry) {
@@ -258,7 +206,8 @@ export const useVocabularyStore = defineStore('vocabulary', () => {
         }
       }
 
-      graph.value.addNode({
+      const engine = graph.value;
+      engine.addNode({
         uri,
         register: registerId,
         conceptId,
@@ -268,14 +217,14 @@ export const useVocabularyStore = defineStore('vocabulary', () => {
       });
 
       for (const edge of edges) {
-        graph.value.addEdge(edge);
+        engine.addEdge(edge);
       }
 
       for (const edge of domainEdges) {
-        graph.value.addEdge(edge);
-        const existing = graph.value.getNode(edge.target);
+        engine.addEdge(edge);
+        const existing = engine.getNode(edge.target);
         if (!existing || !existing.loaded) {
-          graph.value.addNode({
+          engine.addNode({
             uri: edge.target,
             register: registerId,
             conceptId: '',
@@ -287,13 +236,10 @@ export const useVocabularyStore = defineStore('vocabulary', () => {
         }
       }
 
-      // Ensure edges from all datasets are loaded for cross-dataset supersession
-      await ensureAllEdgesLoaded();
-
       touchGraph();
       conceptEdges.value = [
-        ...graph.value.getEdges(uri),
-        ...graph.value.getIncomingEdges(uri),
+        ...engine.getEdges(uri),
+        ...engine.getIncomingEdges(uri),
       ];
     } catch (e: unknown) {
       error.value = `Failed to load concept ${conceptId}: ${e instanceof Error ? e.message : String(e)}`;
@@ -326,32 +272,46 @@ export const useVocabularyStore = defineStore('vocabulary', () => {
       await discoverDatasets();
     }
 
-    const allHits: SearchHit[] = [];
+    const MIN_RESULTS = 20;
+
+    // Pass 1: search loaded data only
+    const loadedHits: SearchHit[] = [];
+    const unloadedAdapters: DatasetAdapter[] = [];
+
     for (const adapter of datasets.value.values()) {
-      if (adapter.manifest) {
-        if (!adapter.index) {
+      if (!adapter.manifest) continue;
+      if (!adapter.index) {
+        try {
           await adapter.loadIndex();
+        } catch {
+          continue;
         }
-        await adapter.ensureAllChunksLoaded();
-        allHits.push(...adapter.search(query));
+      }
+      const hits = adapter.search(query);
+      if (hits.length > 0) {
+        loadedHits.push(...hits);
+      } else {
+        unloadedAdapters.push(adapter);
       }
     }
 
-    // Deduplicate: keep the best hit per (registerId, conceptId)
-    const best = new Map<string, SearchHit>();
-    for (const hit of allHits) {
-      const key = `${hit.registerId}:${hit.conceptId}`;
-      const existing = best.get(key);
-      if (!existing) {
-        best.set(key, hit);
-      } else {
-        // Prefer designation match over id match, then prefer shorter language code (eng first)
-        if (hit.matchField === 'designation' && existing.matchField === 'id') {
-          best.set(key, hit);
-        }
+    const pass1 = deduplicateSearchHits(loadedHits);
+    if (pass1.length >= MIN_RESULTS) return pass1;
+
+    // Pass 2: load chunks lazily for datasets that found nothing in index
+    let allHits = [...loadedHits];
+    for (const adapter of unloadedAdapters) {
+      if (deduplicateSearchHits(allHits).length >= MIN_RESULTS) break;
+      try {
+        await adapter.ensureAllChunksLoaded();
+        const hits = adapter.search(query);
+        allHits.push(...hits);
+      } catch {
+        // Skip datasets that fail to load
       }
     }
-    return [...best.values()];
+
+    return deduplicateSearchHits(allHits);
   }
 
   async function getRandomConcept(): Promise<{ registerId: string; conceptId: string } | null> {

package/src/utils/index.ts

@@ -1 +1,2 @@
 export { langName, langLabel, DEFAULT_LANG } from './lang';
+export { deduplicateSearchHits } from './search';

package/src/utils/relationship-categories.ts

@@ -20,7 +20,7 @@ export const RELATIONSHIP_CATEGORIES: RelationshipCategory[] = [
   {
     id: 'mapping',
     label: 'Equivalence',
-    types: ['equivalent', 'close_match', 'broad_match', 'narrow_match', 'related_match'],
+    types: ['equivalent', 'exact_match', 'close_match', 'broad_match', 'narrow_match', 'related_match'],
     color: 'text-emerald-600 bg-emerald-50',
   },
   {
@@ -53,7 +53,7 @@ export const RELATIONSHIP_CATEGORIES: RelationshipCategory[] = [
   {
     id: 'spatiotemporal',
     label: 'Spatiotemporal',
-    types: ['sequentially_related_concept', 'spatially_related_concept', 'temporally_related_concept'],
+    types: ['sequentially_related', 'spatially_related', 'temporally_related'],
     color: 'text-teal-600 bg-teal-50',
   },
   {
@@ -119,6 +119,7 @@ export const INVERSE_RELATIONSHIPS: Record<string, string> = {
 
   // Symmetric (self-inverse)
   equivalent: 'equivalent',
+  exact_match: 'exact_match',
   compare: 'compare',
   contrast: 'contrast',
   close_match: 'close_match',

package/src/utils/search.ts

@@ -0,0 +1,15 @@
+import type { SearchHit } from '../adapters/types';
+
+export function deduplicateSearchHits(hits: SearchHit[]): SearchHit[] {
+  const best = new Map<string, SearchHit>();
+  for (const hit of hits) {
+    const key = `${hit.registerId}:${hit.conceptId}`;
+    const existing = best.get(key);
+    if (!existing) {
+      best.set(key, hit);
+    } else if (hit.matchField === 'designation' && existing.matchField === 'id') {
+      best.set(key, hit);
+    }
+  }
+  return [...best.values()];
+}

package/src/views/ConceptView.vue

@@ -61,8 +61,6 @@ async function loadAdjacent() {
   adjacent.value = adapter.getAdjacentConcepts(props.conceptId);
 }
 
-watch(() => props.conceptId, () => { loadAdjacent(); });
-
 function goAdjacent(id: string) {
   router.push({ name: 'concept', params: { registerId: props.registerId, conceptId: id } });
   window.scrollTo({ top: 0, behavior: 'smooth' });

package/src/views/DatasetView.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { computed, ref, watch, onMounted, onUnmounted } from 'vue';
+import { computed, ref, watch, onMounted, onUnmounted, onBeforeUnmount } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
 import { useVocabularyStore } from '../stores/vocabulary';
 import { useDsStyle } from '../utils/dataset-style';
@@ -9,7 +9,7 @@ import { langName, langLabel, sortLanguages } from '../utils/lang';
 import ConceptCard from '../components/ConceptCard.vue';
 import { useI18n, locale } from '../i18n';
 import { useSiteConfig } from '../config/use-site-config';
-import type { SectionNode, ManifestSection } from '../adapters/types';
+import type { SectionNode } from '../adapters/types';
 
 const props = defineProps<{ registerId: string }>();
 
@@ -27,6 +27,41 @@ const localizedDescription = computed(() => localizedDatasetField(props.register
 const adapter = computed(() => store.datasets.get(props.registerId));
 const chunkLoading = ref(false);
 
+// Background chunk preloading via requestIdleCallback
+let idlePreloadHandle: ReturnType<typeof requestIdleCallback> | ReturnType<typeof setTimeout> | null = null;
+
+watch(adapter, (a) => {
+  if (idlePreloadHandle !== null) return;
+  if (!a || !a.index) return;
+
+  const schedule = typeof requestIdleCallback !== 'undefined'
+    ? requestIdleCallback
+    : (cb: () => void) => setTimeout(cb, 0);
+
+  idlePreloadHandle = schedule(() => {
+    if (allChunksLoaded.value || !a.index) {
+      idlePreloadHandle = null;
+      return;
+    }
+    const count = a.getConceptCount();
+    if (count <= 200) {
+      a.ensureAllChunksLoaded().then(() => {
+        allChunksLoaded.value = true;
+      }).catch(() => {});
+    } else {
+      a.ensureChunksForRange(0, 100).catch(() => {});
+    }
+    idlePreloadHandle = null;
+  }, { timeout: 2000 } as any);
+});
+
+onBeforeUnmount(() => {
+  if (idlePreloadHandle !== null) {
+    (typeof cancelIdleCallback !== 'undefined' ? cancelIdleCallback : clearTimeout)(idlePreloadHandle as any);
+    idlePreloadHandle = null;
+  }
+});
+
 function formatSize(bytes: number): string {
   if (bytes < 1024) return `${bytes} B`;
   if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`;
@@ -87,37 +122,26 @@ function onGlobalKeydown(e: KeyboardEvent) {
 onMounted(() => window.addEventListener('keydown', onGlobalKeydown));
 onUnmounted(() => window.removeEventListener('keydown', onGlobalKeydown));
 
-// When filtering, ensure all chunks are loaded for accurate search
-watch(filter, async (q) => {
+async function ensureAllChunksForFilter(needsLoad: boolean) {
   page.value = 1;
-  if (q.trim().length >= 2 && !allChunksLoaded.value && adapter.value) {
+  if (needsLoad && !allChunksLoaded.value && adapter.value) {
     chunkLoading.value = true;
     await adapter.value.ensureAllChunksLoaded();
     allChunksLoaded.value = true;
     chunkLoading.value = false;
   }
+}
+
+watch(filter, async (q) => {
+  await ensureAllChunksForFilter(q.trim().length >= 2);
 });
 
-// When section filter changes, reset page and load all chunks
 watch(sectionQuery, async () => {
-  page.value = 1;
-  if (sectionQuery.value && !allChunksLoaded.value && adapter.value) {
-    chunkLoading.value = true;
-    await adapter.value.ensureAllChunksLoaded();
-    allChunksLoaded.value = true;
-    chunkLoading.value = false;
-  }
+  await ensureAllChunksForFilter(!!sectionQuery.value);
 });
 
-// When language filter changes, reset page and load all chunks
 watch(selectedLang, async (lang) => {
-  page.value = 1;
-  if (lang && !allChunksLoaded.value && adapter.value) {
-    chunkLoading.value = true;
-    await adapter.value.ensureAllChunksLoaded();
-    allChunksLoaded.value = true;
-    chunkLoading.value = false;
-  }
+  await ensureAllChunksForFilter(!!lang);
 });
 
 // Dense array: only loaded (non-undefined) entries
@@ -133,38 +157,39 @@ const filtered = computed(() => {
   const sec = sectionQuery.value;
   return loadedConcepts.value.filter(c => {
     if (lang && !(lang in (c.designations ?? {}))) return false;
-    if (sec && !conceptMatchesSection(c.id, sec)) return false;
+    if (sec && !conceptMatchesSection(c, sec)) return false;
     if (!q) return true;
     return (c.eng || '').toLowerCase().includes(q) || c.id.toLowerCase().includes(q);
   });
 });
 
-function conceptMatchesSection(conceptId: string, sectionPrefix: string): boolean {
-  // section-X matches concept IDs starting with X.
-  // e.g. section-1 matches 1.1, 1.2, etc.
-  // section-103-01 matches 103-01-01, 103-01-02, etc.
+function conceptMatchesSection(concept: import('../adapters/types').ConceptSummary, sectionPrefix: string): boolean {
   const prefix = sectionPrefix.replace(/^section-/, '');
-  return conceptId.startsWith(prefix + '.') || conceptId.startsWith(prefix + '-');
+  // Check explicit groups (e.g. G18 sections derived from domains)
+  if (concept.groups?.length && concept.groups.includes(prefix)) return true;
+  // Check concept ID prefix matching (e.g. VIML/VIM numbered sections)
+  return concept.id.startsWith(prefix + '.') || concept.id.startsWith(prefix + '-');
 }
 
 function getSections(): SectionNode[] {
-  const m = manifest.value;
-  if (!m?.sections?.length) return [];
-  return m.sections.map(s => enrichSection(s));
-}
-
-function enrichSection(s: ManifestSection): SectionNode {
-  const node: SectionNode = { id: s.id, names: s.names || {}, conceptCount: 0 };
-  if (s.children && s.children.length > 0) {
-    node.children = s.children.map(c => enrichSection(c));
-  }
-  return node;
+  if (!adapter.value) return [];
+  return adapter.value.getSectionTree();
 }
 
 function sectionName(section: SectionNode): string {
   return section.names[locale.value] || section.names.eng || section.id;
 }
 
+const sectionDisplayName = computed(() => {
+  if (!sectionQuery.value) return '';
+  const prefix = sectionQuery.value.replace(/^section-/, '');
+  const sections = getSections();
+  const found = sections.find(s => s.id === prefix);
+  if (!found) return prefix;
+  const name = sectionName(found);
+  return name !== found.id ? `${found.id} — ${name}` : name;
+});
+
 // Alphabetical grouping
 const alphabetGroups = computed(() => {
   if (viewMode.value !== 'alphabetical') return [];
@@ -367,7 +392,7 @@ function clearSection() {
       <div v-if="sectionQuery" class="flex items-center gap-2 mb-4">
         <span class="text-sm text-ink-500">{{ t('dataset.sectionFilter') }}:</span>
         <span class="inline-flex items-center gap-1.5 px-3 py-1 rounded-lg bg-amber-50 text-amber-700 text-sm font-medium">
-          {{ sectionQuery }}
+          {{ sectionDisplayName }}
           <button @click="clearSection" class="text-amber-400 hover:text-amber-600 transition-colors">
             <svg class="w-3.5 h-3.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/></svg>
           </button>

package/src/views/HomeView.vue

@@ -24,7 +24,6 @@ async function exploreRandom() {
     }
     const result = await store.getRandomConcept();
     if (result) {
-      await store.viewConcept(result.registerId, result.conceptId);
       router.push({ name: 'concept', params: { registerId: result.registerId, conceptId: result.conceptId } });
     }
   } finally {

package/vite.config.ts

@@ -1,6 +1,7 @@
-import { defineConfig } from 'vite'
+import { defineConfig, type Plugin } from 'vite'
 import vue from '@vitejs/plugin-vue'
-import { resolve, dirname } from 'path'
+import { resolve, dirname, extname, join } from 'path'
+import { readFileSync, existsSync, statSync, createReadStream } from 'fs'
 import { fileURLToPath } from 'url'
 import yaml from 'js-yaml'
 
@@ -41,6 +42,40 @@ function faviconPlugin() {
   }
 }
 
+function inlineDataPlugin() {
+  let publicDir: string | undefined
+  const cache: Map<string, string> = new Map()
+  return {
+    name: 'inline-data',
+    configResolved(config: any) {
+      publicDir = config.publicDir
+    },
+    transformIndexHtml(html: string) {
+      if (!publicDir) return html
+      const tags: any[] = []
+      for (const [id, path] of [
+        ['datasets-json', 'datasets.json'],
+        ['site-config-json', 'site-config.json'],
+      ] as const) {
+        try {
+          let data = cache.get(path)
+          if (!data) {
+            data = readFileSync(resolve(publicDir!, path), 'utf-8')
+            cache.set(path, data)
+          }
+          tags.push({
+            tag: 'script',
+            attrs: { type: 'application/json', id },
+            children: data,
+            injectTo: 'body' as const,
+          })
+        } catch { /* file may not exist during first build */ }
+      }
+      return { html, tags }
+    },
+  }
+}
+
 function brandingPlugin() {
   return {
     name: 'branding-inject',
@@ -53,8 +88,8 @@ function brandingPlugin() {
       const fontsUrl = process.env.SITE_FONTS_URL
       if (fontsUrl) {
         result = result.replace(
-          /<link[^>]*href="https:\/\/fonts\.googleapis\.com\/css2\?[^"]*"[^>]*>/,
-          `<link href="${fontsUrl}" rel="stylesheet">`
+          /<link[^>]*href="https:\/\/fonts\.googleapis\.com\/css2\?[^"]*"[^>]*>(?:\s*<noscript>[^<]*<\/noscript>)?/,
+          `<link rel="preload" as="style" href="${fontsUrl}" onload="this.rel='stylesheet'"><noscript><link href="${fontsUrl}" rel="stylesheet"></noscript>`
         )
       }
       return result
@@ -62,15 +97,68 @@ function brandingPlugin() {
   }
 }
 
+const dataDir = resolve(cwd, 'public/data')
+const publicDir = resolve(cwd, 'public')
+
+const mimeTypes: Record<string, string> = {
+  '.json': 'application/json',
+  '.yaml': 'text/yaml',
+  '.yml': 'text/yaml',
+  '.ttl': 'text/turtle',
+  '.jsonld': 'application/ld+json',
+  '.tbx': 'application/xml',
+}
+
+// Serves /data/ files via middleware so the dev server doesn't need to watch
+// the 15,000+ files in public/data/ (which causes fsevents to consume ~400% CPU).
+function dataServePlugin(): Plugin {
+  return {
+    name: 'data-serve',
+    configureServer(server) {
+      server.middlewares.use((req, res, next) => {
+        if (!req.url?.startsWith('/data/')) return next()
+        const filePath = join(dataDir, req.url.slice('/data/'.length))
+        if (!filePath.startsWith(dataDir + '/') && filePath !== dataDir) return next()
+        if (!existsSync(filePath)) return next()
+        try {
+          const stat = statSync(filePath)
+          if (!stat.isFile()) return next()
+          const ext = extname(filePath)
+          res.setHeader('Content-Type', mimeTypes[ext] || 'application/octet-stream')
+          res.setHeader('Content-Length', stat.size)
+          createReadStream(filePath).pipe(res)
+        } catch { next() }
+      })
+    },
+  }
+}
+
 export default defineConfig({
   base: process.env.BASE_PATH || '/',
   root: __dirname,
-  publicDir: resolve(cwd, 'public'),
+  publicDir,
   build: {
     outDir: resolve(cwd, 'dist'),
     emptyOutDir: true,
   },
-  plugins: [yamlPlugin(), faviconPlugin(), brandingPlugin(), vue()],
+  server: {
+    watch: {
+      ignored: [
+        // concept-browser's own non-source dirs (121K+ files in dist/public)
+        resolve(__dirname, 'dist') + '/**',
+        resolve(__dirname, 'public') + '/**',
+        resolve(__dirname, '.datasets') + '/**',
+        resolve(__dirname, '.gcr') + '/**',
+        resolve(__dirname, '.gcr-staging') + '/**',
+        // oiml-vocab's data dir (15K+ files)
+        resolve(cwd, 'public/data') + '/**',
+      ],
+    },
+  },
+  optimizeDeps: {
+    exclude: ['@plurimath/plurimath'],
+  },
+  plugins: [yamlPlugin(), faviconPlugin(), brandingPlugin(), dataServePlugin(), inlineDataPlugin(), vue()],
   resolve: {
     alias: {
       '@': resolve(__dirname, 'src'),