Auto imports doesn't work in script setup template

[beqacrc]

Note

// src/utils/lodash.ts
export const dummy = () => true;

export const _ = {
   dummy() {
     return true
   }
}

<script setup lang="ts">
console.log(dummy) // this works
</script>

<template>
{{ _.dummy }} this doesn't work
</template>

Describe the bug

When using unplugin-auto-import in a Vite project to automatically import dependencies, the _.isArray function from a file (src/utils/lodash.ts) is working correctly in the script context but fails in the template.

The issue manifests as follows:

In the script section (

Index.vue?t=1706181696036:54 TypeError: (intermediate value)(intermediate value)(intermediate value).isArray is not a function
    at Proxy._sfc_render (Index.vue:34:1)
    at renderComponentRoot (chunk-Z55UPKXR.js?v=d34c77c8:2318:17)
    at ReactiveEffect.componentUpdateFn [as fn] (chunk-Z55UPKXR.js?v=d34c77c8:7535:26)
    at ReactiveEffect.run (chunk-Z55UPKXR.js?v=d34c77c8:421:19)
    at instance.update (chunk-Z55UPKXR.js?v=d34c77c8:7588:17)
    at chunk-Z55UPKXR.js?v=d34c77c8:1923:14
    at Array.forEach (<anonymous>)
    at rerender (chunk-Z55UPKXR.js?v=d34c77c8:1915:25)
    at Object.rerender (chunk-Z55UPKXR.js?v=d34c77c8:1981:14)
    at Index.vue?t=1706181696036:54:25

Folder Structure:

project-root
│── src
│   │── utils
│   │   └── lodash.ts
│   │── components
│       │── ExampleComponent.vue
│── vite.config.ts
│── package.json

vite.config.ts

import AutoImport from 'unplugin-auto-import/vite';
import { resolve } from 'path';

export default {
  plugins: [
    AutoImport({
      imports: ['vue', 'vue-router', '@vueuse/core', '@vueuse/math', 'pinia'],
      vueTemplate: true,
      dirs: [
        resolve(__dirname, 'src/utils/**'),
        resolve(__dirname, 'src/composables/**'),
        resolve(__dirname, 'src/config/**'),
      ],
    }),
  ],
};

Reproduction

N/A

System Info

System:
    OS: Linux 6.5 Ubuntu 22.04.3 LTS 22.04.3 LTS (Jammy Jellyfish)
    CPU: (24) x64 13th Gen Intel(R) Core(TM) i7-13700K
    Memory: 24.52 GB / 31.08 GB
    Container: Yes
    Shell: 5.8.1 - /usr/bin/zsh
  Binaries:
    Node: 18.18.2 - ~/.nvm/versions/node/v18.18.2/bin/node
    Yarn: 1.22.21 - ~/.nvm/versions/node/v18.18.2/bin/yarn
    npm: 9.8.1 - ~/.nvm/versions/node/v18.18.2/bin/npm
    pnpm: 8.10.5 - ~/.nvm/versions/node/v18.18.2/bin/pnpm
  Browsers:
    Brave Browser: 120.1.61.120
    Chromium: 120.0.6099.224

Used Package Manager

npm

Validations

• [X] Follow our Code of Conduct
• [X] Read the Contributing Guide.
• [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• [X] Check that this is a concrete bug. For Q&A, please open a GitHub Discussion instead.
• [X] The provided reproduction is a minimal reproducible of the bug.

[beqacrc]

UPDATE

changed

export const _ = { ... }

to

export const $_ = { ... }

and it worked.

but can't figure out why

[brachkow]

Same issue

[minht11]

Experiencing this issue too.

[beqacrc]

I think _ is vue compiler's reserved variable or something like that

[minht11]

I have issue with m variable and mm, didn't try other. I would dare to assume that auto imports do not work in template at all.