vue/no-bare-strings-in-template "allowlist" not always taken into account

[fabienmacko]

Hello,

My .eslintrc.cjs config file explicitly set an "allowlist" for the rule "vue/no-bare-strings-in-template". Those are Google Icons.

For some reasons it's working for most of them, but "edit_note" trigger an error even tho I add it to the allowlist as you can see below.

When I run yarn lint --fix i'm getting:

  104:57  error  Unexpected non-translated string used  vue/no-bare-strings-in-template

As a workaround I did {{ 'edit_note' }} but looks weired.
What could cause this error ? Is it a bug or a mistake in my usage ?

.eslintrc.cjs

'vue/no-bare-strings-in-template': [
            'error',
            {
                allowlist: [
                    '(',
                    ')',
                    ',',
                    '.',
                    '&',
                    '+',
                    '-',
                    '=',
                    '*',
                    '/',
                    '#',
                    '%',
                    '!',
                    '?',
                    ':',
                    '[',
                    ']',
                    '{',
                    '}',
                    '<',
                    '>',
                    '\u00b7',
                    '\u2022',
                    '\u2010',
                    '\u2013',
                    '\u2014',
                    '\u2212',
                    '|',
                    //Allow all google icons
                    'waving_hand',
                    'check_circle',
                    'error',
                    'arrow_drop_up',
                    'arrow_drop_down',
                    'visibility',
                    'edit',
                    'content_copy',
                    'archive',
                    'unarchive',
                    'publish',
                    'arrow_back_ios',
                    'keyboard_arrow_down',
                    'delete',
                    'arrow_upward',
                    'arrow_downward',
                    'edit_note',
                    'close',
                ],
                attributes: {
                    '/.+/': ['title', 'aria-label', 'aria-placeholder', 'aria-roledescription', 'aria-valuetext'],
                    input: ['placeholder'],
                    img: ['alt'],
                },
                directives: ['v-text'],
            },
        ],

Usage in the code

<span class="material-symbols-outlined">edit_note</span>
                                           ^^^^^^^^ Trigger the error

Thanks

[FloEdelmann]

Could you please add a link to your repository, or a Stackblitz/CodeSandbox reproduction?

[fabienmacko]

Unfortunately I can't link any repo since the concerned project is private for a client. But I managed to solve the issue by moving the string 'edit_note' in "allowlist" array. It was penultimate, and putting it behind 'visibility' solved it... Can't explain why.

Thanks for the fast answer anyway.

[FloEdelmann]

Interesting. edit_note probably has to be before edit in the allowlist. That sounds like a bug though that should be possible to fix without a reproduction.