Vuepress使用重定向解决默认语言问题

前言

Vuepress 默认情况下使用/作为默认语言路径，这导致默认语言文件在文件层级上会比其他语言的文件高一级（下图），影响美观和维护，本教程将使用vuepress-plugin-locale-redirect插件修复此问题。

docs
├─ README.md
├─ foo.md
├─ nested
│  └─ README.md
└─ zh
   ├─ README.md
   ├─ foo.md
   └─ nested
      └─ README.md

修改为：

docs
├─ zh
│   ├─ README.md
│   ├─ foo.md
│   └─ nested
│      └─ README.md
├─ en
│   ├─ README.md
│   ├─ foo.md
│   └─ nested
│      └─ README.md
└─ ja
   ├─ README.md
   ├─ foo.md
   └─ nested
      └─ README.md

开始配置

步骤一: cd到你的vuepress程序目录

步骤二：在终端中使用npm安装vuepress-plugin-locale-redirect插件，如果你使用的是其他包管理软件，那么将npm指令更换为你的包管理软件即可

1	npm vuepress-plugin-locale-redirect

步骤三：在config.js(ts)文件头中添加引用插件

1	import { localeRedirectPlugin } from 'vuepress-plugin-locale-redirect'

步骤四：在config的网页设置文件中添加引用（我这里用的是ts格式，如果你用的是js的话，应该是module.exports = {}这种格式），不要直接复制粘贴，参考你本地的代码做修改。也可以参考完整示例代码（有bug，请勿直接复制其他区域）

export default defineUserConfig({
  title: '示例文件',
  description: '示例文件源码',
  //引用插件
  plugins: [
    // @ts-ignore
    localeRedirectPlugin(),
  ],
  //添加路径
  locales: {
  //写在最上方的语言将被认为是默认语言
    '/zh/': {
      lang: 'zh-CN',
      title: '',  
      description: '',
    },
    '/en/': {
      lang: 'en-US',
      title: '',
      description: '',
    },
    '/ja/': {
      lang: '日本语',
      title: '',
      description: '',
    },
  },

完成～

如果要为主题，例如下拉菜单设置多语言，可参考官方文档，将其中的/改为你想要的默认语言即可

如果遇到问题请在下方的联系方式里联系我 使用请遵守MIT协议

本文采用署名-非商业性使用-相同方式共享 4.0 国际许可协议，转载请注明出处。