🔧 build: 使用 yaml i18n

README.md

@@ -65,8 +65,11 @@ complete the following tasks:
 * Meta information about the plugin itself, such as plugin description and readme
     * `description` and `readme` fields in plugin.json, and the corresponding README*.md file
 * Text used in the plugin, such as button text and tooltips
-    * src/i18n/*.json language configuration files
+    * public/i18n/*.json language configuration files
     * Use `this.i18.key` to get the text in the code
+* YAML Support
+  * This template specifically supports I18n based on YAML syntax, see `public/i18n/zh_CN.yaml`
+  * During compilation, the defined YAML files will be automatically translated into JSON files and placed in the dist or dev directory.
 
 It is recommended that the plugin supports at least English and Simplified Chinese, so that more people can use it more
 conveniently.

README_zh_CN.md

@@ -62,9 +62,12 @@
 * 插件自身的元信息，比如插件描述和自述文件
   * plugin.json 中的 `description` 和 `readme` 字段，以及对应的 README*.md 文件
 * 插件中使用的文本，比如按钮文字和提示信息
-  * src/i18n/*.json 语言配置文件
+  * public/i18n/*.json 语言配置文件
   * 代码中使用 `this.i18.key` 获取文本
 * 最后在 plugin.json 中的 `i18n` 字段中声明该插件支持的语言
+* yaml 支持
+  * 本模板特别支持基于 Yaml 语法的 I18n，见 `public/i18n/zh_CN.yaml`
+  * 编译时，会自动把定义的 yaml 文件翻译成 json 文件放到 dist 或 dev 目录下
 
 建议插件至少支持英文和简体中文，这样可以方便更多人使用。
 

package.json

@@ -20,6 +20,7 @@
     "eslint": "^8.42.0",
     "fast-glob": "^3.2.12",
     "glob": "^7.2.3",
+    "js-yaml": "^4.1.0",
     "minimist": "^1.2.8",
     "rollup-plugin-livereload": "^2.0.5",
     "sass": "^1.63.3",

public/i18n/zh_CN.json

@@ -1,21 +0,0 @@
-{
-    "addTopBarIcon": "使用插件添加一个顶栏按钮",
-    "cancel": "取消",
-    "save": "保存",
-    "byeMenu": "再见，菜单！",
-    "helloPlugin": "你好，插件！",
-    "byePlugin": "再见，插件！",
-    "showDialog": "弹出一个对话框",
-    "removedData": "数据已删除",
-    "confirmRemove": "确认删除 ${name} 中的数据？",
-    "insertEmoji": "插入表情",
-    "removeSpace": "移除空格",
-    "getTab": "在日志中打印出已打开的所有自定义页签",
-    "name": "思源",
-    "hello": {
-        "makesure": "使用这个模板之前，请阅读<a href=\"https://github.com/siyuan-note/plugin-sample\">官方教程</a>, 确保自己已经理解了插件的基本开发流程。"
-    },
-    "hintTitle":"关于",
-    "hintDesc":"<a href='https://github.com/siyuan-note/plugin-sample-vite-svelte'>🔗 plugin-sample-vite-svelte</a><br>💻 @frostime<br>💻 @88250<br>💻 @zxkmm"
-
-}

public/i18n/zh_CN.yaml

@@ -0,0 +1,21 @@
+---
+addTopBarIcon: 使用插件添加一个顶栏按钮
+cancel: 取消
+save: 保存
+byeMenu: 再见，菜单！
+helloPlugin: 你好，插件！
+byePlugin: 再见，插件！
+showDialog: 弹出一个对话框
+removedData: 数据已删除
+confirmRemove: 确认删除 ${name} 中的数据？
+insertEmoji: 插入表情
+removeSpace: 移除空格
+getTab: 在日志中打印出已打开的所有自定义页签
+name: 思源
+hello:
+  makesure: 使用这个模板之前，请阅读<a href="https://github.com/siyuan-note/plugin-sample">官方教程</a>,
+    确保自己已经理解了插件的基本开发流程。
+hintTitle: 关于
+hintDesc: "<a href='https://github.com/siyuan-note/plugin-sample-vite-svelte'>\U0001F517
+  plugin-sample-vite-svelte</a><br>\U0001F4BB @frostime<br>\U0001F4BB @88250<br>\U0001F4BB
+  @zxkmm"

vite.config.ts

@@ -7,10 +7,12 @@ import { svelte } from "@sveltejs/vite-plugin-svelte"
 import zipPack from "vite-plugin-zip-pack";
 import fg from 'fast-glob';
 
+import vitePluginYamlI18n from './yaml-plugin';
+
 const args = minimist(process.argv.slice(2))
 const isWatch = args.watch || args.w || false
-const devDistDir = "./dev"
+const devDistDir = "dev"
-const distDir = isWatch ? devDistDir : "./dist"
+const distDir = isWatch ? devDistDir : "dist"
 
 console.log("isWatch=>", isWatch)
 console.log("distDir=>", distDir)
@@ -25,6 +27,11 @@ export default defineConfig({
     plugins: [
         svelte(),
 
+        vitePluginYamlI18n({
+            inDir: 'public/i18n',
+            outDir: `${distDir}/i18n`
+        }),
+
         viteStaticCopy({
             targets: [
                 {

yaml-plugin.js

@@ -0,0 +1,69 @@
+/*
+ * Copyright (c) 2024 by frostime. All Rights Reserved.
+ * @Author       : frostime
+ * @Date         : 2024-04-05 21:27:55
+ * @FilePath     : /yaml-plugin.js
+ * @LastEditTime : 2024-04-05 22:37:40
+ * @Description  : 去妮玛的 json 格式，我就是要用 yaml 写 i18n
+ */
+// plugins/vite-plugin-parse-yaml.js
+import fs from 'fs';
+import yaml from 'js-yaml';
+import { resolve } from 'path';
+
+export default function vitePluginYamlI18n(options = {}) {
+    // Default options with a fallback
+    const DefaultOptions = {
+        inDir: 'src/i18n',
+        outDir: 'dist/i18n',
+    };
+
+    const finalOptions = { ...DefaultOptions, ...options };
+
+    return {
+        name: 'vite-plugin-yaml-i18n',
+        buildStart() {
+            console.log('🌈 Parse I18n: YAML to JSON..');
+            const inDir = finalOptions.inDir;
+            const outDir = finalOptions.outDir
+
+            if (!fs.existsSync(outDir)) {
+                fs.mkdirSync(outDir, { recursive: true });
+            }
+
+            //Remove yaml under outDir, which is auto-moved by vite
+            const outFiles = fs.readdirSync(outDir);
+            for (const file of outFiles) {
+                if (file.endsWith('.yaml') || file.endsWith('.yml')) {
+                    console.log(`-- Remove yaml file ${file} under dist`);
+                    fs.unlinkSync(resolve(outDir, file));
+                }
+            }
+
+            //Parse yaml file, output to json
+            const files = fs.readdirSync(inDir);
+            for (const file of files) {
+                if (file.endsWith('.yaml') || file.endsWith('.yml')) {
+                    console.log(`-- Parsing ${file}`)
+                    //检查是否有同名的json文件
+                    const jsonFile = file.replace(/\.(yaml|yml)$/, '.json');
+                    if (files.includes(jsonFile)) {
+                        console.log(`---- File ${jsonFile} already exists, skipping...`);
+                        continue;
+                    }
+                    try {
+                        const filePath = resolve(inDir, file);
+                        const fileContents = fs.readFileSync(filePath, 'utf8');
+                        const parsed = yaml.load(fileContents);
+                        const jsonContent = JSON.stringify(parsed, null, 2);
+                        const outputFilePath = resolve(outDir, file.replace(/\.(yaml|yml)$/, '.json'));
+                        console.log(`---- Writing to ${outputFilePath}`);
+                        fs.writeFileSync(outputFilePath, jsonContent);
+                    } catch (error) {
+                        this.error(`---- Error parsing YAML file ${file}: ${error.message}`);
+                    }
+                }
+            }
+        },
+    };
+}