在 Laravel 中安裝 PrimeVue

在 Laravel 專案中設定 PrimeVue。

下載 #

PrimeVue 可在 npm 註冊表上下載。


# Using npm
npm install primevue @primevue/themes

# Using yarn
yarn add primevue @primevue/themes

# Using pnpm
pnpm add primevue @primevue/themes

外掛程式 #

需要安裝 PrimeVue 外掛程式作為應用程式外掛程式，以設定預設的配置。此外掛程式非常輕巧，僅用於設定目的。


import { createApp } from 'vue';
import PrimeVue from 'primevue/config';

const app = createApp(App);
app.use(PrimeVue);

主題 #

配置 PrimeVue 以使用像 Aura 這樣的主題。


import { createApp } from 'vue';
import PrimeVue from 'primevue/config';
import Aura from '@primevue/themes/aura';

const app = createApp(App);
app.use(PrimeVue, {
    theme: {
        preset: Aura
    }
});

驗證 #

透過新增像是Button的元件來驗證您的設定。每個元件都可以單獨導入和註冊，以便您僅包含用於捆綁最佳化的內容。導入路徑在相應元件的文件中提供。


import Button from "primevue/button"

const app = createApp(App);
app.component('Button', Button);

範例 #

我們為 Vue 生態系統中流行的選項建立各種範例。造訪 primevue-examples 儲存庫，以取得更多範例，包括 laravel-quickstart 和 inertia-quickstart。

後續步驟 #

歡迎來到 Prime UI 生態系統！一旦您啟動並執行 PrimeVue，我們建議您探索以下資源以更深入地了解此函式庫。