Twoslash

এই ফিচারটি Twoslash থেকে নেয়া।

সব টাইপস্ক্রিপ্ট কোড ব্লক inline type hover প্রোভাইড করে।

twoslash চালু করা

  • @sveltepress/twoslash প্যাকেজ ইন্সটল করুন
npm install --save @sveltepress/twoslash
sh
  • highlighter.twoslash কনফিগ করে true করে দিন
vite.config.(js|ts)
+
+
+
import { defaultTheme  } from '@sveltepress/theme-default'
import { sveltepress  } from '@sveltepress/vite'
import { defineConfig  } from 'vite'

export default defineConfig ({
  plugins : [
    sveltepress ({
      theme : defaultTheme ({
        highlighter : { 
          twoslash : true 
        } 
      })
    })
  ]
})
ts

প্রাথমিক type annotation

const foo  = false

const obj  = {
  a : 'a',
  b : 1
}
ts
```ts
const foo = false

const obj = {
  a: 'a',
  b: 1
}
```
md
Click fold/expand code

এরোর

const foo : Foo = null
Cannot find name 'Foo'.

const a: number = '1'
Type 'string' is not assignable to type 'number'.
ts
```ts
// @errors: 2304 2322
const foo: Foo = null

const a: number = '1'
```
md
Click fold/expand code

কুয়েরি

const hi  = 'Hello'
const msg  = `${hi }, world`

//
//
Number .p arseInt ('123', 10)
//
//
//
//
ts
```ts
const hi = 'Hello'
const msg = `${hi}, world`
//    ^?

//
//
Number.parseInt('123', 10)
//      ^|
//
//
//
//
```
md
Click fold/expand code

কাস্টম লগ

const a  = 1
Custom log message

const b  = 1
Custom error message

const c  = 1
Custom warning message


Custom annotation message
ts
```ts
// @log: Custom log message
const a = 1

// @error: Custom error message
const b = 1

// @warn: Custom warning message
const c = 1

// @annotate: Custom annotation message
```
md
Click fold/expand code

কাট কোডস

আগে কাট

// ---cut--- বা // ---cut-before--- ব্যবহার করে এই লাইনের পূর্বের সকল কোড কাট করা যাবে।

console .log (level )
ts
```ts
const level: string = 'Danger'
// ---cut---
console.log(level)
```
md
Click fold/expand code

পরে কাট

// ---cut-after--- বহার করে এই লাইনের পরের সকল কোড কাট করা যাবে।

console .log (level )
ts
```ts
const level: string = 'Danger'
// ---cut-before---
console.log(level)
// ---cut-after---
console.log('This is not shown')
```
md
Click fold/expand code

কাট শুরু/শেষ

আইটেমের মাঝের কন্টেন্ট কাট করতে // ---cut-start--- বা // ---cut-end--- ব্যবহার করুন

const level : string = 'Danger'
console .log ('This is shown')
ts
```ts
const level: string = 'Danger'
// ---cut-start---
console.log(level) // This is not shown.
// ---cut-end---
console.log('This is shown')
```
md
Click fold/expand code

svelte এর জন্য Twoslash

<script>
  import { onMount  } from 'svelte'

  let count  = $ state (0)

  onMount (() => {
  // mounted
  })
</script>
<button onclick={count ++}>
  Count is: {count }
</button>
svelte
Suggest changes to this page
Last update at: 2024/11/25 05:47:03
Previous
কোড সম্পর্কিত
Next
Unocss