Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Nitro aliases cannot be imported in the Vue part of your app. [importing #config from service/index.ts]

See original GitHub issue

Environment

Operating System: Windows_NT
Node Version: v16.11.0
Nuxt Version: 3.0.0-27465767.70f067a
Package Manager: yarn@1.22.4
Builder: vite
User Config: publicRuntimeConfig
Runtime Modules: -
Build Modules: -

Reproduction

nuxt.config.ts

import { defineNuxtConfig } from 'nuxt3'

// https://v3.nuxtjs.org/docs/directory-structure/nuxt.config
export default defineNuxtConfig({
  publicRuntimeConfig: {
    ENV_TEXT: process.env.ENV_TEXT
  }
})

./service/index.ts

import config from '#config'
export const useService = () => {
  // ...
  console.log(config.ENV_TEXT)
  // ...
}

./pages/index.vue

<script setup lang="ts">
import { onMounted } from 'vue'
import { useService } from '@/service'

onMounted(() => {
  console.log(useService)
})
</script>

<template>
  <div>

  </div>
</template>

Describe the bug

I tried to use import config from '#config' in service according to the documentation but it doesn’t work

error log

 ERROR  下午8:47:18 [vite] Internal server error: Failed to resolve import "#config" from "service\index.ts". Does the file exist?
       20:47:18
  Plugin: vite:import-analysis
  File: D:/Alex/nuxt3-app/service/index.ts
  1  |  import config from "#config";
     |                      ^
  2  |  export const useService = () => {
  3  |    console.log(config.ENV_TEXT);

document https://v3.nuxtjs.org/docs/usage/runtime-config#api-routes

Additional context

No response

Logs

[plugin:vite:import-analysis] Failed to resolve import "#config" from "service\index.ts". Does the file exist?
D:/Alex/nuxt3-app/service/index.ts:1:0
1  |  import config from "#config";
   |                      ^
2  |  export const useService = () => {
3  |    console.log(config.ENV_TEXT);