vscode设计古诗卡片代码

好的，以下是一个基本的 VS Code 插件代码，可以生成古诗卡片：

import * as vscode from 'vscode';

// 获取古诗文本
function getPoetryText(): string {
  // TODO: 这里替换成你获取古诗的方式
  return '静夜思\r\n床前明月光，疑是地上霜。\r\n举头望明月，低头思故乡。';
}

// 解析古诗文本
function parsePoetryText(poetryText: string): any {
  const lines = poetryText.trim().split('\r\n');
  const title = lines[0];
  const author = lines[1].replace(/[\u4e00-\u9fa5]+：/, '');
  const content = lines.slice(2).join('\r\n');
  return { title, author, content };
}

// 设计卡片样式
function designCardStyle(poetry: any): string {
  const cardStyle = `
    <div style="border: 1px solid gray; padding: 10px; width: 300px;">
      <div>${poetry.title}</div>
      <div style="font-size: 12px; color: gray;">${poetry.author}</div>
      <div style="font-size: 14px; margin-top: 10px;">${poetry.content}</div>
    </div>
  `;
  return cardStyle;
}

// 生成古诗卡片
function generatePoetryCard() {
  const poetryText = getPoetryText();
  const poetry = parsePoetryText(poetryText);
  const cardStyle = designCardStyle(poetry);
  const panel = vscode.window.createWebviewPanel(
    'poetryCard',
    '古诗卡片',
    vscode.ViewColumn.One,
    { enableScripts: true }
  );
  panel.webview.html = cardStyle;
}

// 导出古诗卡片
function exportPoetryCard() {
  const poetryText = getPoetryText();
  const poetry = parsePoetryText(poetryText);
  const cardStyle = designCardStyle(poetry);
  // TODO: 这里替换成你导出卡片的方式
  console.log(cardStyle);
}

export function activate(context: vscode.ExtensionContext) {
  context.subscriptions.push(
    vscode.commands.registerCommand('poetry.generateCard', generatePoetryCard),
    vscode.commands.registerCommand('poetry.exportCard', exportPoetryCard)
  );
}

export function deactivate() {}

在这个代码中，我们首先定义了三个函数，分别用于获取古诗文本、解析古诗文本和设计卡片样式。

然后，我们定义了一个生成古诗卡片的函数，它会调用上述三个函数来生成卡片，并将卡片展示在 VS Code 的 Webview 面板中。

最后，我们还定义了一个导出古诗卡片的函数，它会调用上述三个函数来生成卡片，并将卡片导出到控制台中。

我们在插件中注册了两个命令，分别是 `poetry.generateCard` 和 `poetry.exportCard`，用户可以通过快捷键或者命令面板来调用这两个命令。

希望这个代码对你有帮助！