写一个vitepress新建文章脚本,自动化创建链接,别再手写了!

这两天用xx云笔记写东西感觉不方便,限制两个登陆设备。所以简单搭了一个 Vitepress 的环境,用来写点东西,内容也能直接上传到 Git。

但是使用过程中创建文章还得加上连接忒麻烦,所以写了个脚本,跟大家分享一下,做个参考。

修改 config.mts

/docs/.vitepress 下创建 menu.json 文件夹

json 复制代码
[
  {
    "text": "20250418-测试",
    "link": "/20250418-测试"
  }
]

修改 /docs/.vitepress/config.mts 文件

javascript 复制代码
import Menu from "./menu.json"

export default defineConfig({
    themeConfig: {
        sidebar: [
            {
                text: 'Examples',
                items: Menu
            }
        ],
    }
})

编辑脚本

创建 scripts/create-post.js 文件

javascript 复制代码
const fs = require('fs');
const path = require('path');
const readline = require('readline');

// 获取命令行输入
const rl = readline.createInterface({
    input: process.stdin,
    output: process.stdout
});

rl.question('请输入文章名: ', (articleName) => {
    // 格式化日期和文章名
    const date = new Date();
    const year = date.getFullYear();
    let month = date.getMonth() + 1; // 月份从0开始,所以需要加1
    let day = date.getDate();

    // 确保月份和日期是两位数
    month = month < 10 ? '0' + month : month;
    day = day < 10 ? '0' + day : day;

    // 创建文件名
    const fileName = `${year}${month}${day}-${articleName}`;
    const filePath = path.join(__dirname, '../docs', `${fileName}.md`);

    // 写入空文件
    fs.writeFile(filePath, '', (err) => {
        if (err) throw err;
        console.log(`"${fileName}.md" 已经创建在 docs 文件夹下.`);
    });

    // 更新 menu.json 文件
    const menuFilePath = path.join(__dirname, '../docs/.vitepress/menu.json');
    fs.readFile(menuFilePath, 'utf8', (err, data) => {
        if (err) throw err;

        const menuItems = JSON.parse(data);
        const newItem = { text: fileName, link: `/${fileName}` };

        // 添加新项
        menuItems.push(newItem);

        // 将更新后的数据写回到 menu.json 文件
        fs.writeFile(menuFilePath, JSON.stringify(menuItems, null, 2), 'utf8', (err) => {
            if (err) throw err;
            console.log(`新文章链接已添加到 menu.json 文件中.`);
        });
    });

    rl.close();
});

package.json 加上这个指令脚本就行了

json 复制代码
{
  "scripts": {
    "docs:dev": "vitepress dev docs",
    "docs:build": "vitepress build docs",
    "docs:preview": "vitepress preview docs",
    "create": "node scripts/create-post.js"  // 新加指令
  },
  "devDependencies": {
    "vitepress": "^1.6.3"
  }
}

实测好使,折腾呗~

相关推荐
前端小白۞1 小时前
vue2 md文件预览和下载
前端·javascript·vue.js
十里-1 小时前
为什么创建1x1的gif图片,和png 或者jpg图片有什么区别
前端
u***u6851 小时前
Vue云原生
前端·vue.js·云原生
OpenTiny社区2 小时前
TinyEngine 低代码实时协作揭秘:原理 +实操,看完直接用!
前端·vue.js·低代码
5***79002 小时前
Vue项目性能优化
前端·javascript·vue.js
天若有情6733 小时前
【c++】手撸C++ Promise:从零实现通用异步回调组件,支持链式调用+异常安全
开发语言·前端·javascript·c++·promise
抱琴_3 小时前
【Vue3】大屏性能优化黑科技:Vue 3 中实现请求合并,让你的大屏飞起来!
前端·vue.js
不会玩电脑的Xin.3 小时前
HTML + CSS
前端·css·html
hadage2334 小时前
--- JavaScript 的一些常用语法总结 ---
java·前端·javascript