kazupon / vue-i18n

:globe_with_meridians: Internationalization plugin for Vue.js

Home Page:https://kazupon.github.io/vue-i18n/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

| is not support in 9.x?

wxfred opened this issue · comments

commented

Reporting a bug?

I'm using the latest v9 vue-i18n, in my vue file

<i18n>
{
  "en": {
    "Z": "|Z|"
  }
}
</i18n>

A compile error will occur
Syntax Error: Final loader (./node_modules/@intlify/vue-i18n-loader/lib/index.js) didn't return a Buffer or String

If I remove the |, no error come out

<i18n>
{
  "en": {
    "Z": "Z"
  }
}
</i18n>

By the way, vue-i18n@8.28.2 dose not have this problem.

Expected behavior

Support | in i18n content.

Reproduction

  1. Use vue-cli 5 to create a new project
    vue create i18n9test

  2. Install latest vue-i18n and @intlify/vue-i18n-loader

npm install --save vue-i18n
npm install --save-dev @intlify/vue-i18n-loader
  1. Config loader in vue.config.js
module.exports = defineConfig({
  chainWebpack: config => {
    config.module
      .rule('i18n')
        .resourceQuery(/blockType=i18n/)
        .type('javascript/auto')
        .use('i18n')
          .loader('@intlify/vue-i18n-loader')
  },
})
  1. Use i18n in main.js
import { createApp } from 'vue'
import { createI18n } from 'vue-i18n'
import App from './App.vue'
import router from './router'
import store from './store'

createApp(App).use(store).use(router).use(createI18n()).mount('#app')
  1. Append the conent below to App.vue
<i18n>
{
  "en": {
    "Home": "New Home"
  }
}
</i18n>

change <router-link to="/">Home</router-link> to <router-link to="/">{{ $t('Home') }}</router-link>

  1. Run, and no error currently
    npm run serve

  2. Change the i18n content, save and recompile, a error will come out

<i18n>
{
  "en": {
    "Home": "|New Home"
  }
}
</i18n>

System Info

Win10
Node 16.13.1
npm 8.1.2
Chrome 110.0.5481.104
vue 3.2.47
vue-i18n 9.2.2
@intlify/vue-i18n-loader 4.2.0
@vue/cli 5.0.8

Screenshot

No response

Additional context

No response

Validations