feat: add i18n support for ChapterIntroduction component
- Add chapter-introduction locale files for zh-cn and en - Update ChapterIntroduction.vue to use useI18n composable - Fix import paths in ChapterIntroduction.vue
This commit is contained in:
sanbuphy
@@ -1,5 +1,9 @@
|
||||
<script setup>
|
||||
import { computed } from 'vue'
|
||||
import { useI18n } from '../composables/useI18n.js'
|
||||
import chapterIntroductionLocale from '../locales/chapter-introduction/index.js'
|
||||
|
||||
const { t } = useI18n(chapterIntroductionLocale)
|
||||
|
||||
const props = defineProps({
|
||||
duration: {
|
||||
@@ -40,7 +44,7 @@ const hasTags = computed(() => props.tags && props.tags.length > 0)
|
||||
<div class="objective-section">
|
||||
<div class="objective-label">
|
||||
<span class="icon">🎯</span>
|
||||
<span class="title">本章学习目标</span>
|
||||
<span class="title">{{ t('title') }}</span>
|
||||
</div>
|
||||
<div class="content">
|
||||
<!-- If tags are provided, show tags list -->
|
||||
@@ -82,7 +86,7 @@ const hasTags = computed(() => props.tags && props.tags.length > 0)
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<div class="card-label">
|
||||
预计耗时
|
||||
{{ t('duration') }}
|
||||
</div>
|
||||
<div
|
||||
class="card-value"
|
||||
@@ -101,7 +105,7 @@ const hasTags = computed(() => props.tags && props.tags.length > 0)
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<div class="card-label">
|
||||
预期产出
|
||||
{{ t('output') }}
|
||||
</div>
|
||||
<div class="output-container">
|
||||
<div
|
||||
@@ -129,7 +133,7 @@ const hasTags = computed(() => props.tags && props.tags.length > 0)
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<div class="card-label">
|
||||
课后任务
|
||||
{{ t('assignment') }}
|
||||
</div>
|
||||
<div
|
||||
class="card-value"
|
||||
|
||||
@@ -0,0 +1,14 @@
|
||||
export default {
|
||||
'zh-cn': {
|
||||
title: '本章学习目标',
|
||||
duration: '预计耗时',
|
||||
output: '预期产出',
|
||||
assignment: '课后任务'
|
||||
},
|
||||
'en': {
|
||||
title: 'Learning Objectives',
|
||||
duration: 'Estimated Time',
|
||||
output: 'Expected Output',
|
||||
assignment: 'Assignment'
|
||||
}
|
||||
}
|
||||
+29
-29
@@ -9,47 +9,47 @@ Welcome to the **Appendix** section! This is a collection of artificial intellig
|
||||
Understand the core concepts, development history, and cutting-edge technical principles of artificial intelligence:
|
||||
<NavGrid>
|
||||
<NavCard
|
||||
href="/en/appendix/prompt-engineering/"
|
||||
href="/zh-cn/appendix/prompt-engineering/"
|
||||
title="Prompt Engineering"
|
||||
description="Master the art of efficient dialogue with AI to unlock the potential of large models"
|
||||
/>
|
||||
<NavCard
|
||||
href="/en/appendix/ai-evolution"
|
||||
href="/zh-cn/appendix/ai-evolution"
|
||||
title="AI Evolution History"
|
||||
description="Review key milestones in AI development and understand the trajectory of technological evolution"
|
||||
/>
|
||||
<NavCard
|
||||
href="/en/appendix/llm-intro"
|
||||
href="/zh-cn/appendix/llm-intro"
|
||||
title="Large Language Models"
|
||||
description="Deep yet accessible explanation of how Large Language Models (LLMs) work and their applications"
|
||||
/>
|
||||
<NavCard
|
||||
href="/en/appendix/vlm-intro"
|
||||
href="/zh-cn/appendix/vlm-intro"
|
||||
title="Multimodal Large Models"
|
||||
description="Explore advanced models capable of processing multiple data modalities such as images and audio"
|
||||
/>
|
||||
<NavCard
|
||||
href="/en/appendix/image-gen-intro"
|
||||
href="/zh-cn/appendix/image-gen-intro"
|
||||
title="AI Image Generation Principles"
|
||||
description="Uncover the underlying logic and technical implementation of AI image generation"
|
||||
/>
|
||||
<NavCard
|
||||
href="/en/appendix/audio-intro"
|
||||
href="/zh-cn/appendix/audio-intro"
|
||||
title="AI Audio Models"
|
||||
description="Understand AI applications in speech synthesis, recognition, and music generation"
|
||||
/>
|
||||
<NavCard
|
||||
href="/en/appendix/context-engineering"
|
||||
href="/zh-cn/appendix/context-engineering"
|
||||
title="Context Engineering"
|
||||
description="Learn how to optimize context management to improve long-range coherence of AI tasks"
|
||||
/>
|
||||
<NavCard
|
||||
href="/en/appendix/agent-intro"
|
||||
href="/zh-cn/appendix/agent-intro"
|
||||
title="Agent Intelligence"
|
||||
description="Explore AI agent architectures with autonomous decision-making and execution capabilities"
|
||||
/>
|
||||
<NavCard
|
||||
href="/en/appendix/ai-capability-dictionary"
|
||||
href="/zh-cn/appendix/ai-capability-dictionary"
|
||||
title="AI Capability Dictionary"
|
||||
description="A quick reference handbook for commonly used terms and core concepts in the AI field"
|
||||
/>
|
||||
@@ -61,32 +61,32 @@ Understand the core concepts, development history, and cutting-edge technical pr
|
||||
Solidify the technical foundation of frontend development:
|
||||
<NavGrid>
|
||||
<NavCard
|
||||
href="/en/appendix/web-basics"
|
||||
href="/zh-cn/appendix/web-basics"
|
||||
title="HTML/CSS/JS Basics"
|
||||
description="The three pillars of building web pages, essential for frontend development beginners"
|
||||
/>
|
||||
<NavCard
|
||||
href="/en/appendix/frontend-evolution"
|
||||
href="/zh-cn/appendix/frontend-evolution"
|
||||
title="Frontend Evolution History"
|
||||
description="Understand the evolution of frontend technology stacks and grasp technology development trends"
|
||||
/>
|
||||
<NavCard
|
||||
href="/en/appendix/frontend-performance"
|
||||
href="/zh-cn/appendix/frontend-performance"
|
||||
title="Frontend Performance Optimization"
|
||||
description="Learn key strategies to improve webpage loading speed and interaction smoothness"
|
||||
/>
|
||||
<NavCard
|
||||
href="/en/appendix/canvas-intro"
|
||||
href="/zh-cn/appendix/canvas-intro"
|
||||
title="Canvas 2D Basics"
|
||||
description="Master the Canvas drawing API to achieve cool graphics and animation effects"
|
||||
/>
|
||||
<NavCard
|
||||
href="/en/appendix/url-to-browser"
|
||||
href="/zh-cn/appendix/url-to-browser"
|
||||
title="From URL to Browser Display"
|
||||
description="Full-chain analysis of the complete process of browser rendering pages"
|
||||
/>
|
||||
<NavCard
|
||||
href="/en/appendix/browser-devtools/"
|
||||
href="/zh-cn/appendix/browser-devtools/"
|
||||
title="Browser DevTools"
|
||||
description="Proficiently use developer tools to efficiently locate and solve frontend issues"
|
||||
/>
|
||||
@@ -98,42 +98,42 @@ Solidify the technical foundation of frontend development:
|
||||
Master the core concepts of backend development:
|
||||
<NavGrid>
|
||||
<NavCard
|
||||
href="/en/appendix/backend-evolution"
|
||||
href="/zh-cn/appendix/backend-evolution"
|
||||
title="Backend Evolution History"
|
||||
description="From monolithic to microservices, exploring the evolution of backend architecture"
|
||||
/>
|
||||
<NavCard
|
||||
href="/en/appendix/backend-languages"
|
||||
href="/zh-cn/appendix/backend-languages"
|
||||
title="Backend Programming Languages"
|
||||
description="Compare the characteristics and applicable scenarios of mainstream backend languages to choose the best technology stack"
|
||||
/>
|
||||
<NavCard
|
||||
href="/en/appendix/database-intro"
|
||||
href="/zh-cn/appendix/database-intro"
|
||||
title="Database Principles"
|
||||
description="Understand core database principles and master the art of data storage and retrieval"
|
||||
/>
|
||||
<NavCard
|
||||
href="/en/appendix/cache-design"
|
||||
href="/zh-cn/appendix/cache-design"
|
||||
title="System Cache Design"
|
||||
description="Learn caching strategies to improve system high-concurrency processing capabilities"
|
||||
/>
|
||||
<NavCard
|
||||
href="/en/appendix/queue-design"
|
||||
href="/zh-cn/appendix/queue-design"
|
||||
title="Message Queue Design"
|
||||
description="Master the key role of message queues in decoupling and peak shaving"
|
||||
/>
|
||||
<NavCard
|
||||
href="/en/appendix/auth-design"
|
||||
href="/zh-cn/appendix/auth-design"
|
||||
title="Authentication Principles & Practice"
|
||||
description="Build secure identity authentication and permission management systems"
|
||||
/>
|
||||
<NavCard
|
||||
href="/en/appendix/tracking-design"
|
||||
href="/zh-cn/appendix/tracking-design"
|
||||
title="Tracking Design"
|
||||
description="Scientifically design data tracking to provide data support for product decisions"
|
||||
/>
|
||||
<NavCard
|
||||
href="/en/appendix/operations"
|
||||
href="/zh-cn/appendix/operations"
|
||||
title="Online Operations"
|
||||
description="Master operations skills for system deployment, monitoring, and troubleshooting"
|
||||
/>
|
||||
@@ -145,32 +145,32 @@ Master the core concepts of backend development:
|
||||
Basic knowledge of software development:
|
||||
<NavGrid>
|
||||
<NavCard
|
||||
href="/en/appendix/api-intro"
|
||||
href="/zh-cn/appendix/api-intro"
|
||||
title="API Basics"
|
||||
description="Basic knowledge of API interface design and development"
|
||||
/>
|
||||
<NavCard
|
||||
href="/en/appendix/ide-intro/"
|
||||
href="/zh-cn/appendix/ide-intro/"
|
||||
title="IDE Principles"
|
||||
description="Understand the internal working mechanism of Integrated Development Environments (IDEs)"
|
||||
/>
|
||||
<NavCard
|
||||
href="/en/appendix/terminal-intro"
|
||||
href="/zh-cn/appendix/terminal-intro"
|
||||
title="Terminal Basics"
|
||||
description="Master basic command-line terminal operations to improve development efficiency"
|
||||
/>
|
||||
<NavCard
|
||||
href="/en/appendix/git-intro"
|
||||
href="/zh-cn/appendix/git-intro"
|
||||
title="Git Detailed Introduction"
|
||||
description="Deeply understand Git version control principles and advanced usage"
|
||||
/>
|
||||
<NavCard
|
||||
href="/en/appendix/computer-networks"
|
||||
href="/zh-cn/appendix/computer-networks"
|
||||
title="Computer Networks"
|
||||
description="Basic knowledge of network protocols and communication principles"
|
||||
/>
|
||||
<NavCard
|
||||
href="/en/appendix/deployment"
|
||||
href="/zh-cn/appendix/deployment"
|
||||
title="Deployment & Launch"
|
||||
description="Complete process and best practices for application deployment and release"
|
||||
/>
|
||||
|
||||
@@ -757,7 +757,7 @@ In the next chapter, we'll shift focus from "knowing how to use tools" to "makin
|
||||
<span style="font-size: 12px; color: #909399">When you see computer terms you don't understand, quickly look up their meanings here. Recommended to read through once.</span>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<a href="/en/appendix/2-development-tools/ide-basics" style="text-decoration: none; color: inherit;"><b>Appendix 2: Visual Studio Code Menu Bar Analysis</b></a><br/>
|
||||
<a href="/zh-cn/appendix/2-development-tools/ide-basics" style="text-decoration: none; color: inherit;"><b>Appendix 2: Visual Studio Code Menu Bar Analysis</b></a><br/>
|
||||
<span style="font-size: 12px; color: #909399">When you don't know what the AI IDE interface is for, use the following content to consult with AI, or view directly.</span>
|
||||
</el-col>
|
||||
</el-row>
|
||||
@@ -1238,9 +1238,9 @@ If you encounter new words in the learning process later, you can also have AI a
|
||||
|
||||
To help everyone understand the meaning of each option, here we provide an in-depth analysis of the menu bar:
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<details class="custom-block details" id="vscode-file-menu">
|
||||
<summary>File: Project and File Open/Save/Workspace Management</summary>
|
||||
|
||||
Reference in New Issue
Block a user