Skip to content

when set runtimeOnly false, when build can not replace t('') to the dist lang text #482

@TerryChenUI

Description

@TerryChenUI

Reporting a bug?

vite.config.ts

import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";
import VueI18nPlugin from "@intlify/unplugin-vue-i18n/vite";

import { dirname } from "node:path";
import { fileURLToPath } from "node:url";
import path from "path";

const __dirname = dirname(fileURLToPath(import.meta.url));

// https://vite.dev/config/
export default defineConfig({
  build: {
    minify: false,
  },
  plugins: [
    vue(),
    VueI18nPlugin({
      include: path.resolve(__dirname, "./src/locales/zh-cn.json"), // 语言文件路径
      runtimeOnly: false,
      compositionOnly: false,
      strictMessage: true,
      forceStringify: true, // 强制字符串化,确保文案被编译到代码中
    }),
  ],
});

main.ts

import { createApp } from "vue";
import { createI18n } from "vue-i18n";
import "./style.css";
import App from "./App.vue";
import zhCN from './locales/zh-cn.json'

const i18n = createI18n({
  legacy: false,
  locale: "zh-cn",
  messages: {
    "zh-cn": zhCN,
  },
});

const app = createApp(App);

app.use(i18n);

app.mount("#app");

app.vue

<script setup lang="ts">
import { useI18n } from 'vue-i18n'

const { t } = useI18n({inheritLocale: true, useScope: 'local' })

</script>

<template>
  <h1>{{ t('greeting') }}</h1>
</template>
</style>

src/locales/zh-cn.json

{
  "greeting": "你好"
}

Expected behavior

when build except the text '你好' replace t('greeting') is in _toDisplayString

import { createElementVNode as _createElementVNode, toDisplayString as _toDisplayString, openBlock as _openBlock, createElementBlock as _createElementBlock } from "vue";

const _sfc_render = (_ctx, _cache) => {
  return (
    _openBlock(),
    _createElementBlock("template", null, [
      _createElementVNode("h1", null, _toDisplayString("你好!"), 1 /* TEXT */),
      _createElementVNode("h2", null, _toDisplayString(
        `${_ctx.$tm('button.submit')?.replace('{type}', _ctx.type) || ''}`
      ), 1 /* TEXT */)
    ])
  )
};

but now it still has unref(t)("greeting")

const _sfc_main = /* @__PURE__ */ defineComponent({
  __name: "App",
  setup(__props) {
    const { t } = useI18n();
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("h1", null, toDisplayString(unref(t)("greeting")), 1);
    };
  }
});
const resource = {
  "greeting": { "t": 0, "b": { "t": 2, "i": [{ "t": 3 }], "s": "你好" } },
};

Reproduction

no

Issue Package

vite-plugin-vue-i18n

System Info

browsers

Screenshot

No response

Additional context

No response

Validations

  • Read the Contributing Guidelines.
  • Read the README
  • Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
  • Check that this is a concrete bug. For Q&A open a GitHub Discussion.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions