@jet-w/astro-blog 0.2.6 → 0.2.8

package/README.md

@@ -0,0 +1,267 @@
+# @jet-w/astro-blog
+
+A modern, feature-rich Astro blog theme with Vue and Tailwind CSS support. Provides a complete blogging solution with multi-language support, rich markdown capabilities, and interactive components.
+
+**Official Website**: [https://jet-w.github.io/jet-w.astro-blog/](https://jet-w.github.io/jet-w.astro-blog/)
+
+## Features
+
+- **Multi-Language Support (i18n)** - Built-in internationalization with configurable locales
+- **Blog System** - Posts, tags, categories, archives, and pagination
+- **Search** - Full-text search powered by Fuse.js
+- **RSS Feed** - Automatic RSS feed generation
+- **Dark Mode** - Theme switching support
+- **Rich Markdown** - Code highlighting, math equations (KaTeX), Mermaid diagrams, custom containers
+- **Interactive Components** - Slides, ECharts, video embeds (YouTube, Bilibili)
+- **Responsive Design** - Mobile-friendly layouts with Tailwind CSS
+
+## Installation
+
+```bash
+npm install @jet-w/astro-blog
+```
+
+## Peer Dependencies
+
+Make sure you have these packages installed:
+
+```bash
+npm install astro @astrojs/mdx @astrojs/rss @astrojs/tailwind @astrojs/vue tailwindcss vue
+```
+
+## Quick Start
+
+### 1. Configure Astro
+
+Add the integration to your `astro.config.mjs`:
+
+```js
+import { defineConfig } from 'astro/config';
+import { astroBlog } from '@jet-w/astro-blog';
+
+export default defineConfig({
+  integrations: [astroBlog()],
+});
+```
+
+### 2. Set Up Content Collections
+
+Create `src/content/config.ts`:
+
+```ts
+import { defineCollection, z } from 'astro:content';
+
+const posts = defineCollection({
+  type: 'content',
+  schema: z.object({
+    title: z.string(),
+    description: z.string().optional(),
+    date: z.date(),
+    tags: z.array(z.string()).optional(),
+    categories: z.array(z.string()).optional(),
+    draft: z.boolean().optional(),
+  }),
+});
+
+export const collections = { posts };
+```
+
+### 3. Create Your First Post
+
+Create a markdown file in `src/content/posts/`:
+
+```markdown
+---
+title: Hello World
+date: 2024-01-01
+tags: [hello, first-post]
+---
+
+Welcome to my blog!
+```
+
+## Configuration
+
+### Site Configuration
+
+Create `src/config/site.ts`:
+
+```ts
+import { defineSiteConfig } from '@jet-w/astro-blog/config';
+
+export default defineSiteConfig({
+  title: 'My Blog',
+  description: 'A blog about...',
+  author: 'Your Name',
+  lang: 'en',
+});
+```
+
+### i18n Configuration
+
+Create `src/config/i18n.ts`:
+
+```ts
+import { defineI18nConfig } from '@jet-w/astro-blog/config';
+
+export default defineI18nConfig({
+  defaultLocale: 'en',
+  locales: ['en', 'zh-cn'],
+  translations: {
+    en: {
+      'nav.home': 'Home',
+      'nav.blog': 'Blog',
+      // ...
+    },
+    'zh-cn': {
+      'nav.home': '首页',
+      'nav.blog': '博客',
+      // ...
+    },
+  },
+});
+```
+
+### Sidebar Configuration
+
+Create `src/config/sidebar.ts`:
+
+```ts
+import { defineSidebarConfig } from '@jet-w/astro-blog/config';
+
+export default defineSidebarConfig({
+  // Manual configuration
+  items: [
+    { label: 'Getting Started', link: '/docs/getting-started' },
+    { label: 'Guide', items: [...] },
+  ],
+  // Or use auto-scan
+  autoScan: {
+    directory: 'docs',
+  },
+});
+```
+
+## Layouts
+
+The theme provides several layouts:
+
+- **BaseLayout** - Standard page layout
+- **PageLayout** - Blog post layout with sidebar
+- **AboutLayout** - Profile/about page layout
+- **SlidesLayout** - Presentation slides layout
+
+```astro
+---
+import { PageLayout } from '@jet-w/astro-blog/layouts';
+---
+
+<PageLayout title="My Page">
+  <p>Page content here</p>
+</PageLayout>
+```
+
+## Components
+
+Import components as needed:
+
+```astro
+---
+import { SearchBox, ThemeToggle, LanguageSwitcher } from '@jet-w/astro-blog/components';
+---
+
+<SearchBox />
+<ThemeToggle />
+<LanguageSwitcher />
+```
+
+### Available Components
+
+- **UI**: SearchBox, ThemeToggle, LanguageSwitcher, MobileMenu, Pagination
+- **Blog**: NavigationTabs, RelatedPosts, TagList
+- **Media**: Video, YouTube, Bilibili, Slides
+- **About**: TagCard, SocialLinks, Timeline
+
+## Markdown Extensions
+
+### Custom Containers
+
+```markdown
+:::tip
+This is a tip
+:::
+
+:::warning
+This is a warning
+:::
+
+:::danger
+This is dangerous
+:::
+
+:::details Summary
+Hidden content here
+:::
+```
+
+### Math Equations
+
+```markdown
+Inline: $E = mc^2$
+
+Block:
+$$
+\int_0^\infty e^{-x^2} dx = \frac{\sqrt{\pi}}{2}
+$$
+```
+
+### Mermaid Diagrams
+
+````markdown
+```mermaid
+graph TD
+    A[Start] --> B{Decision}
+    B -->|Yes| C[OK]
+    B -->|No| D[Cancel]
+```
+````
+
+### Tabs
+
+```markdown
+:::tabs
+@tab JavaScript
+console.log('Hello');
+
+@tab Python
+print('Hello')
+:::
+```
+
+## Project Structure
+
+```
+src/
+├── components/     # Vue and Astro components
+├── config/         # Configuration files
+├── layouts/        # Layout templates
+├── pages/          # Route pages
+├── plugins/        # Markdown/MDX plugins
+├── styles/         # Global styles
+├── types/          # TypeScript definitions
+└── utils/          # Utility functions
+```
+
+## License
+
+[Apache 2.0](./LICENSE)
+
+## Author
+
+Haiyue
+
+## Links
+
+- [Official Website](https://jet-w.github.io/jet-w.astro-blog/)
+- [GitHub Repository](https://github.com/jet-w/jet-w.astro-blog)
+- [NPM Package](https://www.npmjs.com/package/@jet-w/astro-blog)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jet-w/astro-blog",
-  "version": "0.2.6",
+  "version": "0.2.8",
   "description": "A modern Astro blog theme with Vue and Tailwind CSS support",
   "type": "module",
   "exports": {
@@ -44,7 +44,8 @@
     "src/types",
     "src/utils",
     "src/config",
-    "templates"
+    "templates",
+    "README.md"
   ],
   "scripts": {
     "build": "tsup",

package/src/pages/posts/[...slug].astro

@@ -325,10 +325,81 @@ const formatDate = (date: Date) => {
     </header>
 
     <!-- 文章内容 -->
-    <div class="prose prose-slate dark:prose-invert max-w-none prose-lg">
+    <div class="prose prose-slate dark:prose-invert max-w-none prose-lg" data-prose-content data-locale-prefix={localePrefix} data-base-url={base}>
       {Content && <Content />}
     </div>
 
+    <!-- 修复文章内容中的链接，添加当前语言前缀 -->
+    <script is:inline>
+      (function() {
+        function fixProseLinks() {
+          const proseContent = document.querySelector('[data-prose-content]');
+          if (!proseContent) return;
+
+          const localePrefix = proseContent.getAttribute('data-locale-prefix') || '';
+          const baseUrl = proseContent.getAttribute('data-base-url') || '';
+
+          // 如果没有 locale prefix 或 locale prefix 等于 base url，则不需要修复
+          // 这意味着当前是默认语言
+          if (!localePrefix || localePrefix === baseUrl) return;
+
+          // 获取 locale 部分 (从 localePrefix 中提取，例如 /base/zh-CN -> zh-CN)
+          const localePart = localePrefix.replace(baseUrl, '').replace(/^\//, '');
+          if (!localePart) return;
+
+          // 修复所有内部链接
+          proseContent.querySelectorAll('a[href]').forEach(function(link) {
+            const href = link.getAttribute('href');
+            if (!href) return;
+
+            // 跳过外部链接、锚点链接、mailto、tel 等
+            if (href.startsWith('http://') ||
+                href.startsWith('https://') ||
+                href.startsWith('//') ||
+                href.startsWith('#') ||
+                href.startsWith('mailto:') ||
+                href.startsWith('tel:') ||
+                href.startsWith('data:')) {
+              return;
+            }
+
+            // 跳过已经包含 locale 前缀的链接
+            if (href.startsWith(localePrefix + '/') || href === localePrefix) {
+              return;
+            }
+
+            // 对于以 baseUrl 开头但没有 locale 的链接，添加 locale
+            if (baseUrl && href.startsWith(baseUrl + '/')) {
+              const pathAfterBase = href.slice(baseUrl.length);
+              // 检查是否已经有 locale 前缀
+              if (!pathAfterBase.startsWith('/' + localePart + '/') && pathAfterBase !== '/' + localePart) {
+                link.setAttribute('href', baseUrl + '/' + localePart + pathAfterBase);
+              }
+              return;
+            }
+
+            // 对于绝对路径链接 (以 / 开头)，添加 locale prefix
+            if (href.startsWith('/')) {
+              // 检查是否已经有 locale 前缀
+              if (!href.startsWith('/' + localePart + '/') && href !== '/' + localePart) {
+                link.setAttribute('href', localePrefix + href);
+              }
+            }
+          });
+        }
+
+        // 页面加载后执行
+        if (document.readyState === 'loading') {
+          document.addEventListener('DOMContentLoaded', fixProseLinks);
+        } else {
+          fixProseLinks();
+        }
+
+        // 支持 Astro 视图过渡
+        document.addEventListener('astro:page-load', fixProseLinks);
+      })();
+    </script>
+
     <!-- 文章底部 -->
     <footer class="not-prose mt-16 pt-8 border-t border-slate-200 dark:border-slate-700">
       <!-- 分类信息 -->