bundle-tools: ERROR [unplugin-vue-i18n] Detected HTML in (nuxt3, vite, vueI18n)

Reporting a bug?

I use nuxt 3.4.1 In version unplugin-vue-i18n 0.10.0 i have error

ERROR [unplugin-vue-i18n] Detected HTML in

vesion 0.8.2 work great

I use vue-i18n this:

import {useLocale} from “@/composables/locale”; import messages from ‘@intlify/unplugin-vue-i18n/messages’

export default defineNuxtPlugin(({vueApp}) => { const i18n = createI18n({ legacy: false, globalInjection: true, warnHtmlMessage: false, locale: useLocale().value, messages })

vueApp.use(i18n)

})

Expected behavior

Not error

Reproduction

"@intlify/unplugin-vue-i18n": "^0.10.0",
"nuxt": "^3.4.0",
"vue-i18n": "^9.2.2"

Issue Package

vite-plugin-vue-i18n

System Info

System:
    OS: Windows 10 10.0.19044
    CPU: (12) x64 Intel(R) Core(TM) i7-10750H CPU @ 2.60GHz
    Memory: 2.68 GB / 15.82 GB
  Binaries:
    Node: 18.15.0 - C:\Program Files\nodejs\node.EXE
    npm: 9.6.1 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Chrome: master_preferences
    Edge: Spartan (44.19041.1266.0), Chromium (112.0.1722.39)
    Internet Explorer: 11.0.19041.1566
  npmPackages:
    vue-i18n: ^9.2.2 => 9.2.2

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.

About this issue

  • Original URL
  • State: closed
  • Created a year ago
  • Reactions: 2
  • Comments: 17 (2 by maintainers)

Most upvoted comments

For me the following config solved the issue:

export default defineNuxtConfig({
  i18n: {
    compilation: {
      strictMessage: false,
    },
  },
})

The right config key is compilation and not precompile -> https://v8.i18n.nuxtjs.org/options/misc

Thank you for your reporting!

You need to configure strictMessage: false. Please see the option at here: https://github.com/intlify/bundle-tools/tree/main/packages/unplugin-vue-i18n#strictmessage

I should mention that if you’re using nuxt-i18n then you should add this to i18n option in nuxt.config.ts:

precompile: {
  strictMessage: false,
}

Thank you for your reporting!

You need to configure strictMessage: false. Please see the option at here: https://github.com/intlify/bundle-tools/tree/main/packages/unplugin-vue-i18n#strictmessage

I’m using the latest version of the tool and nuxt 3.6.5 and if I have:

compilation: {
	strictMessage: false,
},

I don’t see anymore the error message, but the HTML tag gets printed ( all I want to do is to add a “<br>” tag for formatting my text, I actually see “<br>” printed out ). What’s the solution here ?

escapeHtml: true or false simply changes how the tag is printed out to screen.

I add strictMessage: false in createI18n and in my nuxt.config.ts but in both cases I get same error

I use vue-i18n and nuxt 3.4.1

So you have it like this, right?

export default defineNuxtConfig({
  i18n: {
    precompile: {
      strictMessage: false,
    },
  },
})

I added it a little differently, but I did it now the way you wrote, unfortunately the same error in html.

Following the logical path that you suggested, I added it like this and it works) p.s. this is setting add in nuxt.config.ts

image

code:

vite: {
        plugins: [
            VueI18nVitePlugin({
                strictMessage: false,
                include: [
                    resolve(dirname(fileURLToPath(import.meta.url)), './locales/*.json')
                ]
            })
        ],
 },