Vite প্লাগিন

এক নজরে Types

import type {  } from 'shiki/langs'
import type {  } from 'unified'
import type {  } from 'vite'

export type  = <[], any>

export type  = (: string, : , ?: string) => string | <string>

export type  = [] | ((: ) => <[]>) | ((: ) => [])

export interface SiteConfig {
  ?: string
  ?: string
}
export interface ResolvedTheme {
  : string
  : string
  : string
  : 
  : 
  ?: []
  ?: []
  /**
   * The footnote label used for [remark rehype](https://github.com/remarkjs/remark-rehype#api)
   */
  ?: string
}

export type  = ((: []) => [])

export type  = ((: []) => [])

export interface PageInfo {
  : string
  : string
  : string
  : <string, unknown>
}

export interface LlmsConfig {
  ?: boolean
  ?: string
  ?: string
  ?: string
  ?: string
  ?: (: string, : <string, unknown>) => boolean
  ?: (: PageInfo, : PageInfo) => number
}

export interface SveltepressVitePluginOptions {
  ?: ResolvedTheme
  ?: SiteConfig
  ?: boolean
  ?: [] | 
  ?: [] | 
  ?: LlmsConfig
}

export type < = any> = (?: ) => ResolvedTheme

export type  = <any[], any> | [<any[], any>, any]

export type  = <>

প্লাগিন অপশন

siteConfig

• title: সাইটের টাইটেল। না থাকলে 'Untitled site' দেখাবে।
• description: সাইটের ডেসক্রিপশন। না থাকলে 'Build by sveltepress' দেখাবে।

addInspect

যদি true সেট করা হয়, তাহলে Vite plugin inspect যোগ করা হবে। ভিট পাইপলাইন দেখা ও পর্যবেক্ষণ করা বেশ উপকারী।

theme

নিম্নে ResolvedTheme দেখুন

remarkPlugins

The remark plugins ব্যবহার করা হয়েছে মার্কডাউন এর জন্য। আরো জানতে Remark plugins পড়ুন।

rehypePlugins

The rehype plugins ব্যবহার করা হয়েছে html জেনারেট করার জন্য। আরো জানতে Rehype plugins পড়ুন।

ResolvedTheme

name

থিমের নাম

globalLayout

গ্লোবাল লে আউটের অ্যাবসোলুট পাথ। svelte ফাইল হতে হবে যেমন: path.resolve(process.cwd(), 'ThemeGlobalLayout.svelte')

pageLayout

পেজ লে আউটের অ্যাবসোলুট পাথ svelte ফাইল হতে হবে যেমন: path.resolve(process.cwd(), 'ThemePageLayout.svelte')

vitePlugins

• যদি এক বা একাধিক প্লাগিন পাস করা হয়, সেই প্লাগিনগুলো sveltepress এর সামনে অ্যাপ্লাই করা হবে।
• যদি একটি ফাংশন পাস করা হয়, এটি sveltepress অ্যাক্সেপ্ট করবে এবং প্লাগিনের গ্রুপ রিটার্ন করবে। আপনি রিটার্নকৃত প্লাগিন চেইনে sveltepress এর প্লাগিন অর্ডার কাস্টমাইজ করতে পারেন।

highlighter

কোড হাইলাইটিং এর জন্য ব্যবহৃত। যেমন, ডিফল্ট থিম shiki ব্যবহার করে। আপনি বিস্তারিত ব্যবহারবিধি জানতে ডিফল্ট থিম হাইলাইটার সোর্স কোড চেক করতে পারেন।

remarkPlugins

The remark plugins ব্যবহৃত হয় মার্কডাউন পার্সিং এর জন্য। বিস্তারিত জানতে Remark plugins পড়ুন।

rehypePlugins

html জেনারেটরের জন্য The rehype plugins ব্যবহৃত হয়। বিস্তারিত জানতে Rehype plugins পড়ুন।

import {  } from '@sveltepress/theme-default'
import {  } from '@sveltepress/vite'
import {  } from 'vite'

export default ({
  : [
    ({
      : (/* theme options */),
      : [/* yourRemarkPlugin */]
    })
  ]
})

footnoteLabel

ফুটনোটের টাইটেল কাস্টমাইজ করতে। ডিফল্ট হচ্ছে "Footnotes"

Virtual modules

virtual:sveltepress/site

এই মডিউল siteConfig কে হোল্ড করে। এখানে একটি উদাহরণ-

<script>
  import  from 'virtual:sveltepress/site'
</script>

<p>The site title is: {.}</p>
<p>The site description is: {.}</p>

Low level API

The @sveltepress/vite এর mdToSvelte একটি লোড লেভেল এপিআই ফাংশন আছে এটি Sveltepress এ সকল বড় বড় মার্কডাউন রেন্ডারের জন্য ব্যবহৃত হয়। এটি Svelte এর সাথে সম্পৃক্ত আরো বেসিক মার্কডাউন রেন্ডারিং ইঞ্জিনের জন্য ব্যবহার করা যাবে ।

ব্যবহারবিধি:

import {  } from '@sveltepress/vite'

const  = `
---
title: Foo
---
<script>
  const foo = 'bar'
</script>
# Title

foo in script is: {foo}

[Foo Link](https://foo.bar)
`

const { ,  } = await ({
  ,
  : [], // your custom remark plugins
  : [], // your custom rehype plugins
  : async (, , ) => .('The rendered highlighted code html'), // your custom code highlighter
  : 'foo.md', // the virtual file path
})

// The rendered svelte code


// The frontmatter object, { title: 'Foo' }

Typescript এর ব্যবহার

প্লাগিন অপশন এবং ভার্চুয়াল মডিউল টাইপ টিপসের জন্য src/app.d.ts তে @sveltepress/vite/types যুক্ত করতে হবে

/// <reference types="@sveltepress/vite/types" />

// এখানে আপনার অন্যান্য টাইপ থাকবে