پرش به محتوا
بناBana UI

حالت نمایش

پالت رنگی

با ↑ ↓ جابه‌جا شوید و Enter را بزنید. Esc برای بستن.

روش‌های نصب

Bana UI را با npm، Yarn، pnpm، Bun، Composer، NuGet، CDN یا مستقیم از Git بگیرید. همهٔ روش‌ها همان پوشهٔ dist/ را در اختیارتان می‌گذارند.

وضعیت انتشار نسخهٔ Alpha است. بسته‌های npm، Composer و NuGet بعد از انتشار در رجیستری مربوطه قابل نصب‌اند؛ تا آن زمان از Git یا فایل‌های آمادهٔ پوشهٔ dist استفاده کنید.

Git (کلون)

Git
کد
git clone https://github.com/ghazanfaris/bana-ui.git
cd bana-ui
npm run all

npm، Yarn، pnpm و Bun

هر چهار از رجیستری npm می‌گیرند؛ لازم نیست جداگانه چیزی منتشر شود.

یکی را انتخاب کنید
کد
npm install @bana-ui/core
yarn add @bana-ui/core
pnpm add @bana-ui/core
bun add @bana-ui/core
استفاده در باندلر (Vite، Webpack، Bun و…)
کد
import "@bana-ui/core/css";
import { Bana } from "@bana-ui/core";
Bana.start();

CDN (jsDelivr)

CDN
کد
<script src="https://cdn.jsdelivr.net/npm/@bana-ui/core@0.1.0-alpha.0/dist/bana-init.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@bana-ui/core@0.1.0-alpha.0/dist/bana.min.css">
<script type="module">
  import { Bana } from "https://cdn.jsdelivr.net/npm/@bana-ui/core@0.1.0-alpha.0/dist/bana.js";
  Bana.start();
</script>

نسخه را همیشه ثابت بنویسید تا با انتشار نسخهٔ تازه چیزی نشکند.

Composer (PHP)

Composer
کد
composer require bana-ui/core:@alpha

نسخهٔ Alpha است، پس :@alpha لازم است (Composer به‌طور پیش‌فرض فقط نسخهٔ پایدار می‌گیرد). Composer فایل‌ها را در vendor/bana-ui/core/dist/ می‌گذارد که معمولاً از وب در دسترس نیست. آن را به پوشهٔ عمومی کپی کنید، برای نمونه با یک اسکریپت در composer.json پروژه‌تان:

composer.json پروژهٔ شما
کد
{
  "scripts": {
    "post-install-cmd": "cp -r vendor/bana-ui/core/dist public/vendor/bana-ui"
  }
}

NuGet (‎.NET)

NuGet
کد
dotnet add package Bana.UI --prerelease

در ASP.NET Core فایل‌ها به‌عنوان Static Web Asset در مسیر /_content/Bana.UI/ سرو می‌شوند:

Razor / _Layout.cshtml
کد
<link rel="stylesheet" href="~/_content/Bana.UI/dist/bana.min.css" />
<script src="~/_content/Bana.UI/dist/bana-init.js"></script>
<script type="module" src="~/_content/Bana.UI/dist/bana.js"></script>

دانلود مستقیم

فایل‌های dist/bana.min.css، dist/bana-init.js و dist/bana.js را از آخرین Release در GitHub بردارید و کنار صفحه‌تان بگذارید؛ نیازی به هیچ ابزاری نیست.

ویرایش این صفحه در GitHub