Parsing errors inside tsconfig files

[SAntoineS]

What is the issue?

Hi !

I recently downloaded the extenstion directly from Intellij IDE, I restarted my IDE and the window still appear empty.

My components.json looks like this :

{
  "$schema": "https://shadcn-vue.com/schema.json",
  "style": "default",
  "typescript": true,
  "tsConfigPath": "./tsconfig.json",
  "tailwind": {
    "config": "tailwind.config.js",
    "css": "src/assets/index.css",
    "baseColor": "slate",
    "cssVariables": true
  },
  "framework": "vite",
  "aliases": {
    "components": "@/components",
    "utils": "@/lib/utils"
  }
}

What are the steps to reproduce this issue?

Just download normally the extension and restart .

What were you expecting to happen?

Was expecting like screenshot with my actual imported components etc...

Paste any relevant logs, error output, etc.

No response

What OS are you experiencing the problem on?

Windows

Additional platform information

No response

Duplicates

• [X] I have checked that my problem has not already been mentioned recently in an existing issue

[WarningImHack3r]

Hi! Can you show me you tsconfig file?

[SAntoineS]

Hi! Can you show me you tsconfig file?

I have 3 tsconfig.json files.

The main one references the two others : tsconfig.json

{
  "files": [],
  "references": [
    {
      "path": "./tsconfig.node.json"
    },
    {
      "path": "./tsconfig.app.json"
    }
  ]
}

And there is the others : tsconfig.app.json

{
  "compilerOptions": {
    "target": "ES2023",
    "useDefineForClassFields": true,
    "module": "ESNext",
    "lib": ["ES2023", "DOM", "DOM.Iterable"],
    "skipLibCheck": true,

    /* Bundler mode */
    "moduleResolution": "bundler",
    "allowImportingTsExtensions": true,
    "isolatedModules": true,
    "moduleDetection": "force",
    "noEmit": true,
    "jsx": "preserve",

    /* Linting */
    "strict": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "noFallthroughCasesInSwitch": true,

    "baseUrl": ".",
    "paths": {
      "@/*": ["./src/*"]
    }
  },
  "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.vue"]
}

tsconfig.node.json

{
  "compilerOptions": {
    "target": "ES2022",
    "lib": ["ES2023"],
    "module": "ESNext",
    "skipLibCheck": true,

    /* Bundler mode */
    "moduleResolution": "bundler",
    "allowImportingTsExtensions": true,
    "isolatedModules": true,
    "moduleDetection": "force",
    "noEmit": true,

    /* Linting */
    "strict": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "noFallthroughCasesInSwitch": true,

    "baseUrl": ".",
    "paths": {
      "@/*": ["./src/*"]
    }
  },
  "include": [
    "vite.config.mts"
  ]
}

[WarningImHack3r]

I don't recursively traverse the tsconfig files so that might be the issue. It's weird you don't get reported any error though; can you please share your logs so I can dig further?

In the meantime, try to merge your paths blocks into the main tsconfig.json, it might do the trick

[SAntoineS]

I don't recursively traverse the tsconfig files so that might be the issue. It's weird you don't get reported any error though; can you please share your logs so I can dig further?

In the meantime, try to merge your paths blocks into the main tsconfig.json, it might do the trick

So there is the log from Intellij IDEA (100 last lines) : shadcn.log

I merged my two tsconfig in one tsconfig.json but still don't work, and now I have this internal error from Intellij itself :

Failed to parse tsconfig.json. Please try removing comments and trailing commas from it and try again.

kotlinx.serialization.json.internal.JsonDecodingException: Unexpected JSON token at offset 54: Expected colon ':', but had 'U' instead at path: $
JSON input: .....{
    "target": "ES2023", // Using the latest target from b.....
    at kotlinx.serialization.json.internal.JsonExceptionsKt.JsonDecodingException(JsonExceptions.kt:24)
    at kotlinx.serialization.json.internal.JsonExceptionsKt.JsonDecodingException(JsonExceptions.kt:32)
    at kotlinx.serialization.json.internal.AbstractJsonLexer.fail(AbstractJsonLexer.kt:580)
    at kotlinx.serialization.json.internal.AbstractJsonLexer.fail$default(AbstractJsonLexer.kt:578)
    at kotlinx.serialization.json.internal.AbstractJsonLexer.fail$kotlinx_serialization_json(AbstractJsonLexer.kt:231)
    at kotlinx.serialization.json.internal.AbstractJsonLexer.fail$kotlinx_serialization_json$default(AbstractJsonLexer.kt:226)
    at kotlinx.serialization.json.internal.AbstractJsonLexer.consumeNextToken(AbstractJsonLexer.kt:206)
    at kotlinx.serialization.json.internal.JsonTreeReader.readObject(JsonTreeReader.kt:128)
    at kotlinx.serialization.json.internal.JsonTreeReader.read(JsonTreeReader.kt:101)
    at kotlinx.serialization.json.internal.JsonTreeReader.readObject(JsonTreeReader.kt:20)
    at kotlinx.serialization.json.internal.JsonTreeReader.read(JsonTreeReader.kt:101)
    at kotlinx.serialization.json.internal.StreamingJsonDecoder.decodeJsonElement(StreamingJsonDecoder.kt:50)
    at kotlinx.serialization.json.JsonElementSerializer.deserialize(JsonElementSerializers.kt:50)
    at kotlinx.serialization.json.JsonElementSerializer.deserialize(JsonElementSerializers.kt:27)
    at kotlinx.serialization.json.internal.StreamingJsonDecoder.decodeSerializableValue(StreamingJsonDecoder.kt:69)
    at kotlinx.serialization.json.Json.decodeFromString(Json.kt:165)
    at kotlinx.serialization.json.Json.parseToJsonElement(Json.kt:195)
    at com.github.warningimhack3r.intellijshadcnplugin.backend.sources.Source.parseTsConfig(Source.kt:125)
    at com.github.warningimhack3r.intellijshadcnplugin.backend.sources.impl.VueSource.resolveAlias$resolvePath(VueSource.kt:41)
    at com.github.warningimhack3r.intellijshadcnplugin.backend.sources.impl.VueSource.resolveAlias(VueSource.kt:57)
    at com.github.warningimhack3r.intellijshadcnplugin.backend.sources.Source.getInstalledComponents(Source.kt:167)
    at com.github.warningimhack3r.intellijshadcnplugin.ui.ISPWindowContents$panel$1$1.invokeSuspend(ISPWindowContents.kt:54)
    at kotlin.coroutines.jvm.internal.BaseContinuationImpl.resumeWith(ContinuationImpl.kt:33)
    at kotlinx.coroutines.DispatchedTask.run(DispatchedTask.kt:104)
    at kotlinx.coroutines.scheduling.CoroutineScheduler.runSafely(CoroutineScheduler.kt:608)
    at kotlinx.coroutines.scheduling.CoroutineScheduler$Worker.executeTask(CoroutineScheduler.kt:873)
    at kotlinx.coroutines.scheduling.CoroutineScheduler$Worker.runWorker(CoroutineScheduler.kt:763)
    at kotlinx.coroutines.scheduling.CoroutineScheduler$Worker.run(CoroutineScheduler.kt:750)
    Suppressed: kotlinx.coroutines.internal.DiagnosticCoroutineContextException: [StandaloneCoroutine{Cancelled}@27769b5b, Dispatchers.Default]

Problem from my ES2023 version ?

[WarningImHack3r]

I merged my two tsconfig in one tsconfig.json but still don't work, and now I have this internal error from Intellij itself :

Failed to parse tsconfig.json. Please try removing comments and trailing commas from it and try again.
...

Problem from my ES2023 version ?

No you're fine! It a crash I trigger from the plugin: I don't support very well comments inside the tsconfig as it says, try removing them

So there is the log from Intellij IDEA (100 last lines) : shadcn.log

Thanks! It's indeed a parsing errors with tsconfig files: one because I completely messed up the parsing of tsconfig.app.json files and the other because of my attempt of removing comments from the file, which messes up with your include block. I'll fix that ASAP, but in the meantime you can bypass these issues by moving your paths block(s) directly in your tsconfig.json and removing any comments from it (if any). If your tsconfig.json is as you showed me and you append it your paths block from the other files, it will work.

Sorry for the inconvenience!

[SAntoineS]

If your tsconfig.json is as you showed me and you append it your paths block from the other files, it will work.

I removed all my comments and it works fine !

Thanks for solution and quick responses 😄 !