Skip to content

[Bug]: TypeScript syntax error when installing sidebar component in JavaScript project #1500

@YYelf

Description

@YYelf

Reproduction

npm create vite@latest my-project

Describe the bug

I'm trying to install the shadcn-vue sidebar component in a pure JavaScript project. Although I've set "typescript": false in my components.json , the installation still fails with the following error:

[@vue/compiler-sfc] Failed to resolve import source ".". 

ui/sidebar/Sidebar.vue                                              
12 |  })                                                            
13 |                                                                
14 |  const props = withDefaults(defineProps<SidebarProps>(), {     
   |                                         ^^^^^^^^^^^^           
15 |    side: "left",                                               
16 |    variant: "sidebar",

The error is clearly due to the generated component using TypeScript syntax defineProps() , while my project is a pure JavaScript project.

I'm using the latest version of shadcn-vue (installed via npx shadcn-vue@latest add sidebar ).

I've already checked similar issues ( #1060 and #1144 ), but these didn't provide an effective solution.

Environment Information

  • shadcn-vue version: latest
  • Vue version: ^3.5.22
  • Project type: JavaScript (not TypeScript)
  • Operating System: Windows

Steps to Reproduce

  1. Create a new Vue JavaScript project (not TypeScript)
  2. Install shadcn-vue and configure "typescript": false in components.json
  3. Run npx shadcn-vue@latest add sidebar
  4. Observe installation failure with the error message shown above
    Expected Behavior When "typescript": false is set in components.json , the generator should create JavaScript versions of components without TypeScript syntax.

Possible Solution Could the component generator be modified to ensure that components generated in JavaScript mode do not contain TypeScript syntax?

System Info

System:
    OS: Windows 11 10.0.26100
    CPU: (24) x64 AMD Ryzen 9 5900X 12-Core Processor            
    Memory: 69.62 GB / 127.88 GB
  Binaries:
    Node: 22.17.0
    Yarn: 1.22.22
    npm: 10.9.2
    pnpm: 10.18.2
    bun: 1.3.0
  Browsers:
    Chrome: 141.0.7390.108
    Edge: Chromium (140.0.3485.54)
    Internet Explorer: 11.0.26100.1882

Contributes

  • I am willing to submit a PR to fix this issue
  • I am willing to submit a PR with failing tests

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions