从个人经验来kan，把一篇带有代码块、图表甚至动态加载内容的文章迁移过去，Ru果只靠复制粘贴，一篇往往要耗费十几分钟甚至geng久。随着文章数量的累积，这种手工方式会导致：

图片链接失效或丢失。

代码格式被破坏，需要二次修正。

元信息缺失。

当这些“小毛病”堆叠起来就会让整个站点的质量评估打折扣。于是我决定把「读取‑解析‑下载‑压缩‑上传」这五步封装进一个脚本，让它们在 Trae 的终端里悄悄跑完。每次只需要提供原文 URL，就Neng得到一份符合 Nuxt Content 标准的 markdown 文件。

Trae 的编辑器自带强大的插件系统和即时执行环境，无需切换窗口即可敲代码、调试。

MCP 为我们提供了两大 API：

chrome_read_page: 抓取页面原始 HTML。

chrome_get_web_content: 返回经渲染后的完整文本和资源列表。

MCP 的"chrome_get_web_content" Neng够返回浏览器Yi经执行完所有 JS 后的完整 HTML。下面是一段示例代码：

const { execMcp } = require;
/**
 * 用 MCP 拉取Yi渲染页面
 * @param {string} url 待抓取地址
 * @returns {Promise} 完整 HTML 文本
 */
async function fetchRenderedHTML {
    const result = await execMcp;
    if  throw new Error;
    return result.data.html;
}

小技巧：Ru果目标站点对爬虫Zuo了防护，Ke以先打开 Chrome 手动登录一次再让 MCP 在同一会话中请求，这样就Neng顺利拿到内容。

拿到 HTML 后用 Cheerio 快速定位标题、段落以及所有 `` 标签：

const cheerio = require;
function parseArticle {
    const $ = cheerio.load;
    const title = $.first.text.trim || '未命名';
    const mdContent = ;
    // 把每段文字转成 markdown 格式
    $.each => mdContent.push.text));
    // 收集所有图片链接
    const imgUrls = ;
    $.each => {
        const src = $.attr;
        if ) imgUrls.push;
    });
    return {
        title,
        body: mdContent.join,
        images: imgUrls
    };
}

别忘了把相对路径补全为绝对 URL，否则后面的下载环节会找不到文件。

MCP Yi经帮我们把图片地址挑出来现在轮到「wget-improved」登场。下面演示一次性拉齐全部资源，并使用 @squoosh/lib Zuo无损压缩：

const wget = require;
const { compress } = require;
const fs   = require;
const path = require;
async function downloadAndCompress {
    if ) fs.mkdirSync;
    for  {
        const fileName = path.basename.pathname);
        const localPath = path.join;
        // 下载
        await new Promise => {
            wget.download
                .on => res)
                .on);
        });
        // 压缩
        const raw   = fs.readFileSync;
        const { binary } = await compress;
        fs.writeFileSync, binary);
        // 删除原始大文件
        fs.unlinkSync;
    }
}

Ru果你对画质要求极致，Ke以把 quality 调高到 92 左右；若想geng快一点，则直接使用默认配置即可。

Alicloud OSS 的 SDK 使用起来非常直观，只需要配好 AccessKey 与 Bucket 名称，即可把刚才压好的图片推送上云：

const OSS   = require.default;
const client= new OSS({
    region : 'cn-beijing',
    accessKeyId     : process.env.ALI_OSS_ID,
    accessKeySecret : process.env.ALI_OSS_SECRET,
    bucket          : 'my-website-assets'
});
/**
 * 把本地目录下全部文件上传到指定前缀
 */
async function uploadFolder{
    const files=fs.readdirSync;
    for{
        const localPath   = path.join;
        const remotePath  = `${remotePrefix}/${f}`;
        await client.put;
      // Ru果想省流量，也Ke以开启 multipart 并行上传……
      console.log;
   }
}

随后我们利用 @nuxt/content-utils 把标题、摘要、标签等信息写进 front‑matter，Zui终得到一篇 ready‑to‑publish 的 markdown 文件：

const { generateFrontMatter } = require;
/**
 * 保存为 markdown 并写入 front-matter
 */
function saveAsMarkdown{
   const fm = generateFrontMatter({
       title       : articleObj.title,
       description: articleObj.body.slice+'…',
       date       : new Date.toISOString,
       tags       : ,
       coverImage : articleObj.images ? `${imgBaseUrl}/${path.basename}` : ''
   });
   const mdContent = `${fm}

${articleObj.body}`;
   const outPath   = `content/articles/${articleObj.title.replace}.md`;
   fs.writeFileSync;
}