Skip to content

Library Mutex Principle

TechUI follows a strict "Single Core Principle": in a single engineering project, it is strictly forbidden to simultaneously introduce or initialize multiple TechUI component libraries.

This means you cannot install @techui/scifi and @techui/base at the same time in the same project, nor should you attempt to mix @techui/admin and @techui/scifi. TechUI's architectural design requires that projects maintain a single dependency source.

Technical Constraints

This mutual exclusivity is not an arbitrary restriction but is determined by TechUI's underlying architecture. Forcing a mixture will lead to the following serious runtime conflicts:

🧩 Wasm Singleton Conflict

All TechUI component libraries (Scifi/Base/Admin/Prime) share the same underlying Rust Wasm runtime environment.

  • Guard Fingerprint: The Wasm guard locks the current runtime environment fingerprint during initialization. Loading two Wasm modules simultaneously will lead to unpredictable errors.
  • Global Hooks: Multiple core libraries simultaneously attempting to mount the window global object or hijack native APIs will lead to unpredictable behavior.

🎨 Style and Namespace Pollution

  • CSS Variable Overwriting: All component libraries define CSS variables (such as --font-weaker) through :root.
  • Vue Context Conflict: During the app.use() registration phase, different libraries might register global components with the same name, such as <TuiButton>.

Product Positioning

TechUI divides its product lines to meet the needs of different scenarios. The Prime Edition exists specifically to solve the problem of needing multiple specialized features at once.

  • Specialized:

    • Scifi: Focuses on sci-fi visuals and dynamic SVG paths.
    • Base: Focuses on basic charts and data presentation.
    • Admin: Focuses on backend business logic and forms.
    • These are designed as "specialized students" isolated from each other, suitable for pure, single scenarios.
  • All-in-One:

    • Prime: This is the only permitted "all-rounder".

Decision Guide

If you are confused during selection, please refer to the following decision matrix:

Your NeedsRecommended SolutionIncorrect Practice
Only need cool large-screen backgrounds@techui/scifi-
Only need simple data reports@techui/base-
Need both cool backgrounds and rich charts@techui/prime❌ Install Scifi + Base simultaneously
Started with Base, want to add sci-fi effects laterUpgrade to @techui/prime**❌ Add Scifi on top of Base

Dependency Warning

In your package.json, ensure that your dependencies only contain one TechUI core library.

❌ Strictly Prohibited: Multi-library Coexistence

Although npm install might not report an error, it will cause the browser to crash or fuse during project runtime.

javascript
// package.json
{
  "dependencies": {
    "vue": "^3.0.0",
    "@techui/scifi": "^1.0.0",  // <--- Conflict Source 1
    "@techui/base": "^1.0.0"    // <--- Conflict Source 2 (Forbidden to coexist with Scifi)
  }
}

✅ Correct Operation: Use Prime

If you need the functionality of both, Prime is the only solution.

javascript
// main.ts
import { createApp } from 'vue';
// By introducing only Prime, you get Scifi visuals and Base charts
import PrimeInit from "@techui/prime"; 
import "@techui/prime/dist/style.css";

const app = createApp(App);
app.use(PrimeInit, { /* config */ });

Released under the MIT License.