CODEWITHSUNDEEP
vue.jseslintvuejs3vue-i18n
KennyDope
KennyDope

Reputation: 499

Vue 3 + ESLint warning [intlify] Detected HTML

Getting a warning inside the console "[intlify] Detected HTML in .....", but can't figure out how to disable this warning for this specific line. I've also tried to change the eslintrc.js file to disable all v-html warnings but didn't work out.

dependencies

    "vue": "^3.0.0",
    "vue-i18n": "^9.2.0-beta.15",

devDependencies

    "@vue/cli-plugin-babel": "^4.5.14",
    "@vue/cli-plugin-eslint": "^4.5.14",
    "@vue/cli-service": "^4.5.14",
    "@vue/compiler-sfc": "^3.0.0",
    "@vue/eslint-config-standard": "^6.1.0",
    "babel-eslint": "^10.1.0",
    "eslint": "^7.32.0",
    "eslint-config-standard": "^16.0.3",
    "eslint-plugin-import": "^2.25.2",
    "eslint-plugin-node": "^11.1.0",
    "eslint-plugin-promise": "^4.3.1",
    "eslint-plugin-vue": "^7.19.1",

Eslint config file

  extends: [
    'standard',
    'eslint:recommended',
    'plugin:vue/essential',
    '@vue/standard'
  ],
  parserOptions: {
    parser: 'babel-eslint',
    impliedStrict: true
  },
  rules: {
    'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
    'no-new': 'off',
    'no-var': 'off',
    indent: ['error', 2],
    semi: 0
  },

Upvotes: 13

Views: 10894

Answers (3)

Alex Shesterov
Alex Shesterov

Reputation: 27565

Update 2022:

With Vue-I18n Version 9+, there are two different settings depending on the used mode:

  • Setting for the composition API mode:

    warnHtmlMessage: false

  • Setting for the legacy API mode:

    warnHtmlInMessage: "off"

Citation from the Vue-I18n V9 Release Notes

In Vue I18n v8.x, the value of warnHtmlInMessage was "off". Therefore, by default, no warning is output to the console even if the message contains HTML.

In Vue I18n v9 or later, change the default values as follows:

  • Legacy API mode: warnHtmlInMessage property: "warn"
  • Composition API mode: warnHtmlMessage boolean property, default true

Upvotes: 22

Boy.Lee
Boy.Lee

Reputation: 155

for vue i18N v9.x or later version, you can use "warnHtmlMessage" option in the demo code.

const i18n = setupI18n({
  globalInjection: true,
  legacy: false,
  warnHtmlMessage: false, // disable warning HTML in message
  locale: 'en',
  fallbackLocale: 'en',
  messages: {
    en
  }
})

Upvotes: 12

Daniel Piñeiro
Daniel Piñeiro

Reputation: 3159

This comes from warnHtmlInMessage vue i18n , what you need to change is the options of it when you create it.

Probably you will have a createI18n or a VueI18n method somewhere. In there you can disable it like:

createI18n({
    warnHtmlInMessage: 'off' // disable of the Detected HTML in message
});

Upvotes: 10

Related Questions