@@ -34,7 +41,11 @@ $ npm install @slidev/theme-seriph
$ slidev theme eject
```
+<<<<<<< HEAD
Тема, которую вы сейчас используете, будет извлечена в `./theme`, а frontmatter будет изменён на
+=======
+It will eject the theme you are using currently into `./theme`, and changed your frontmatter to
+>>>>>>> dbfb0168dc2a10c37d04f991ec135a402b411f02
```yaml
---
diff --git a/themes/write-a-theme.md b/themes/write-a-theme.md
index 06966af..e8f3bf6 100644
--- a/themes/write-a-theme.md
+++ b/themes/write-a-theme.md
@@ -12,12 +12,21 @@ $ npm init slidev-theme
Тема может содержать:
+<<<<<<< HEAD
- Глобальные стили
- Дефолтные конфигурации (шрифты, цветовые схемы, подсветки, и т.д.)
- Кастомные шаблоны или замена существующих
- Кастомные компоненты или замена существующих
- Расширение конфигурации Windi CSS
- Настройка таких инструментов, как Monaco или Prism
+=======
+- Global styles
+- Provide default configurations (fonts, color schema, highlighters, etc.)
+- Provide custom layouts or override the existing one
+- Provide custom components or override the existing one
+- Extend UnoCSS/Windi CSS configurations
+- Configure tools like Monaco and Prism
+>>>>>>> dbfb0168dc2a10c37d04f991ec135a402b411f02
## Соглашения
@@ -52,7 +61,11 @@ theme: ./
Чтобы опубликовать свою тему, просто запустите `npm publish`, и всё. Процесс сборки не требуется (это означает, что вы можете напрямую публиковать файлы `.vue` и` .ts`, Slidev достаточно умён, чтобы понять их).
+<<<<<<< HEAD
Пункты добавления темы следуют тем же соглашениям, что и локальная настройка, подробнее в [документации по соглашениям об именовании](/custom/).
+=======
+Theme contribution points follow the same conventions as local customization, please refer to [the docs for the naming conventions](/custom/).
+>>>>>>> dbfb0168dc2a10c37d04f991ec135a402b411f02
## Конфигурации по умолчанию
@@ -64,7 +77,7 @@ theme: ./
// package.json
{
"slidev": {
- "default": {
+ "defaults": {
"aspectRatio": "16/9",
"canvasWidth": 980,
"fonts": {
@@ -118,9 +131,15 @@ Slidev переключает класс `dark` в элементе `html` ст
### Подсветка
+<<<<<<< HEAD
В теме также предусмотрены цвета для подсветки синтаксиса. Мы поддерживаем как [Prism](https://prismjs.com/), так и [Shiki](https://github.com/shikijs/shiki). Подробнее в [документации по подсветке синтаксиса](/custom/highlighters).
Вы можете использовать как один из них, так и оба. Примеры конфигураций дефолтной темы смотрите в [`./styles/prism.css`](https://github.com/slidevjs/slidev/blob/main/packages/theme-default/styles/prism.css) / [`./setup/shiki.ts`](https://github.com/slidevjs/slidev/blob/main/packages/theme-default/setup/shiki.ts).
+=======
+Syntax highlighting colors are also provided in the theme. We support both [Prism](https://prismjs.com/), [Shiki](https://github.com/shikijs/shiki). For more information please refer to [the syntax highlighting docs](/custom/highlighters).
+
+You can support either one of them, or both. Refer to the default theme for configurations examples [`./styles/code.css`](https://github.com/slidevjs/slidev/blob/main/packages/create-theme/template/styles/code.css) / [`./setup/shiki.ts`](https://github.com/slidevjs/slidev/blob/main/packages/create-theme/template/setup/shiki.ts).
+>>>>>>> dbfb0168dc2a10c37d04f991ec135a402b411f02
Также не забудьте указать поддерживаемую подсветку в вашем `package.json`
@@ -128,7 +147,11 @@ Slidev переключает класс `dark` в элементе `html` ст
// package.json
{
"slidev": {
+<<<<<<< HEAD
"highlighter": "shiki" // или "prism", или "all"
+=======
+ "highlighter": "shiki" // or "prism" or "both"
+>>>>>>> dbfb0168dc2a10c37d04f991ec135a402b411f02
}
}
```
diff --git a/tsconfig.json b/tsconfig.json
index 73cb046..d7623f1 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -1,26 +1,27 @@
{
"compilerOptions": {
- "module": "ESNext",
- "baseUrl": ".",
"target": "es2016",
+ "jsx": "preserve",
"lib": ["DOM", "ESNext"],
- "strict": true,
- "esModuleInterop": true,
- "skipLibCheck": true,
- "noUnusedLocals": true,
+ "baseUrl": ".",
+ "module": "ESNext",
"moduleResolution": "node",
"resolveJsonModule": true,
- "strictNullChecks": true,
- "forceConsistentCasingInFileNames": true,
"types": [
"vite/client",
"node"
- ]
+ ],
+ "strict": true,
+ "strictNullChecks": true,
+ "noUnusedLocals": true,
+ "esModuleInterop": true,
+ "forceConsistentCasingInFileNames": true,
+ "skipLibCheck": true
},
"include": [
"./*.ts",
"./.vitepress/**/*.ts",
- "./.vitepress/**/*.vue",
+ "./.vitepress/**/*.vue"
],
"exclude": ["**/dist/**", "node_modules"]
}
diff --git a/uno.config.ts b/uno.config.ts
new file mode 100644
index 0000000..5ba580d
--- /dev/null
+++ b/uno.config.ts
@@ -0,0 +1,27 @@
+import { defineConfig, presetAttributify, presetUno, presetWebFonts, transformerDirectives } from 'unocss'
+
+export default defineConfig({
+ presets: [
+ presetUno(),
+ presetAttributify(),
+ presetWebFonts({
+ fonts: {
+ mono: ['IBM Plex Mono', 'monospace'],
+ },
+ }),
+ ],
+ transformers: [
+ transformerDirectives(),
+ ],
+ shortcuts: {
+ 'bg-main': 'bg-white dark:bg-[#111]',
+ },
+ theme: {
+ colors: {
+ primary: {
+ DEFAULT: '#3AB9D4',
+ deep: '#2082A6',
+ },
+ },
+ },
+})
diff --git a/vite.config.ts b/vite.config.ts
index f63194c..eba4341 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -1,10 +1,12 @@
-import { resolve } from 'path'
-import { UserConfig } from 'vite'
-import Icons, { ViteIconsResolver } from 'vite-plugin-icons'
-import Components from 'vite-plugin-components'
-import WindiCSS from 'vite-plugin-windicss'
+import { resolve } from 'node:path'
+import { defineConfig } from 'vite'
+import Icons from 'unplugin-icons/vite'
+import IconsResolver from 'unplugin-icons/resolver'
+import Components from 'unplugin-vue-components/vite'
+import Inspect from 'vite-plugin-inspect'
+import UnoCSS from 'unocss/vite'
-const config: UserConfig = {
+export default defineConfig({
resolve: {
alias: {
'@slidev/client': resolve(__dirname, '.vitepress/@slidev/client'),
@@ -27,20 +29,22 @@ const config: UserConfig = {
plugins: [
Components({
dirs: [
- '.vitepress/theme/components',
- '.vitepress/@slidev/client/builtin',
+ './.vitepress/theme/components',
+ './.vitepress/@slidev/client/builtin',
],
- customLoaderMatcher: id => id.endsWith('.md'),
- customComponentResolvers: [
- ViteIconsResolver({
- componentPrefix: '',
+ extensions: ['vue', 'md'],
+ include: [/\.vue$/, /\.vue\?vue/, /\.md$/],
+ resolvers: [
+ IconsResolver({
+ prefix: '',
}),
],
}),
- Icons(),
- WindiCSS({
- preflight: false,
+ Icons({
+ defaultStyle: 'display: inline-block;',
}),
+ Inspect(),
+ UnoCSS(),
{
name: 'code-block-escape',
enforce: 'post',
@@ -52,16 +56,14 @@ const config: UserConfig = {
},
{
name: 'virtual-modules',
- resolveId(id){
+ resolveId(id) {
return id === '/@slidev/configs' ? id : null
},
load(id) {
- if(id !== '/@slidev/configs')
- return
+ if (id !== '/@slidev/configs')
+ return
return 'export default {}'
- }
+ },
},
],
-}
-
-export default config
+})
diff --git a/windi.config.ts b/windi.config.ts
deleted file mode 100644
index dc1bf6e..0000000
--- a/windi.config.ts
+++ /dev/null
@@ -1,34 +0,0 @@
-import { defineConfig } from 'vite-plugin-windicss'
-import aspectRatio from 'windicss/plugin/aspect-ratio'
-
-export default defineConfig({
- extract: {
- include: [
- '**/*.md',
- '.vitepress/theme/**/*.{md,vue}',
- '.vitepress/@slidev/client/internals/SlideContainer.vue',
- '.vitepress/@slidev/client/layouts/*.vue',
- '.vitepress/@slidev/theme-default/layouts/*.vue',
- ]
- },
- attributify: true,
- plugins: [
- aspectRatio,
- ],
- shortcuts: {
- 'bg-main': 'bg-white dark:bg-[#111]',
- },
- theme: {
- extend: {
- colors: {
- primary: {
- DEFAULT: '#3AB9D4',
- deep: '#2082A6',
- },
- },
- fontFamily: {
- mono: '\'IBM Plex Mono\', source-code-pro, Menlo, Monaco, Consolas, \'Courier New\', monospace',
- },
- },
- },
-})