如何在站点的页脚中显示 package.json 版本？

Question

我想在我的网站页脚的 package.json 文件中显示声明的版本

我怎样才能做到这一点？

我在他们的文档中找到了这个常见问题解答解释，但不幸的是我不知道从我的组件中访问它

// svelte.config.js

import { readFileSync } from 'fs';
import { fileURLToPath } from 'url';
 
const file = fileURLToPath(new URL('package.json', import.meta.url));
const json = readFileSync(file, 'utf8');
const pkg = JSON.parse(json);

Answer 1

您可以使用vite.define以下方法来执行此操作：

const config = {
  kit: {
    vite: {
      define: {
        VERSION: pkg
      }
    }
  }
};

并在您的组件中：

<script>
  const version = VERSION;
</script>

<span>{version}</span>

编辑于 06.07.2023

自从回答以来，设置似乎已经发生了变化。现在您可以vite.config.js按如下方式执行此操作：

import { sveltekit } from '@sveltejs/kit/vite';
import { defineConfig } from 'vite';
import { readFileSync } from 'fs';
import { fileURLToPath } from 'url';

const file = fileURLToPath(new URL('package.json', import.meta.url));
const json = readFileSync(file, 'utf8');
const pkg = JSON.parse(json);

export default defineConfig({
    plugins: [sveltekit()],
    define: {
        PKG: pkg
    }
});

并使用

<p>{PKG.version}</p>