Vuepress 2'nin Theme Hope ile Kurulumu ve Temel Ayarlar

Kaynak

Kurulum

Yeni bir bloğu vuepress-theme-hope temasıyla oluşturmak için aşağıdaki kod bloğunda [dir] ile ana klasörü (src, docs vb.) belirterek npm veya pnpm scripti çalıştırmak ve ardından çıkan sorulara ilgili cevapları vermek yeterli. Bu sorularda site yapılandırmasının 'dokümantasyon' veya 'blog' yönünde olması için de bir soru mevcut. Bunu sonradan site içerisinden dtekrar ayarlama imkanı ayrıca var. Sicriptin çalışması tamamlandığında template demo içeriğiyle hazır olacak.

Siteyi Lokalde Ayağa kaldırma

'package.json' dosyasında da yazdığı gibi siteyi ayağa lokalde ayağa kaldırmak için pnpm docs:dev komutu veya npm kullanımında npm run docs:dev gerekli.

Ayarlar

Sitenin genel ayarları ana klasör dizininde('.../docs') '.vuepress' klasörü içerisinde 'config.ts' veya 'config.js' dosyasında yer alır.

...
  └─ docs
    ├─ .vuepress
    |  └─ config.ts

Benzer şekilde vuepress ana kaynağı '.vuepress' klasörüdür.

Ayarlar için Vuepresin kendi sitesindeki bu bağlantıdan yararlanabilirsiniz.

Dil Ayarları

Maalesef site için şu an Türkçe dil ayarı yok. Aşağıdaki gibi ana konfigurasyon dosyasında json formatındaki dönüş değeri içerisindeki locales değerine verilen anahtar değer (key/value) çiftleri ile dil yönetimi yapılır. Detay

//.../.vuepress/config.ts

import { defineUserConfig } from "vuepress";
import theme from "./theme.js";

export default defineUserConfig({
  base: "/",

  dest: "./dist",

  locales: {
    "/": {
      lang: "en-US",
      title: "Blog Demo",
      description: "A blog demo for vuepress-theme-hope",
    },
    "/zh/": {
      lang: "zh-CN",
      title: "博客演示",
      description: "vuepress-theme-hope 的博客演示",
    },
  },

  theme,

...
});

Buradaki title ve description değerleri ile ilgili dillerde blog başlığı ve açıklaması düzenlebiliyor.