Issue with VSCode Extension: Unable to Recognize Commands

I've been developing a VS Code extension that reads data from JSON files and displays it in a custom views container.

After compiling my extension to a VSIX, everything seems fine. However, once installed, none of the commands I defined in the package.json are recognized.

Upon installation and restarting VS Code, when I click on the icon for my view container and try to use the mapped buttons, I receive an error stating "

command <commandname> not found
".

Additionally, I keep receiving warnings suggesting the use of webpack due to including several hundred files.

In reality, I only have 32 files in my source and resources folders combined, along with 8 other files at the root level (such as .gitignore). I'm excluding node_modules in my tsconfig.json, so I'm unsure where all these extra files are coming from, whether they're development dependencies or something else entirely.

Any advice or suggestions would be greatly appreciated!

typescriptvisual-studio-codevscode-extensions

Answer №1

I discovered that the key to success was eliminating node_modules from the exclude: [] portion of my .tsconfig file. Once I made this adjustment, everything started working flawlessly.

Before creating a package with vsce, make sure to run npm install in your extension project directory. Afterwards, execute vsce package. To see what will be included in the package, use vsce ls.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Passing a value to a property with a dynamically passed name in TypeScript

I'm encountering an eslint/typescript error message: errorUnsafe member access .value on an any value @typescript-eslint/no-unsafe-member-access when attempting to assign a value to a dynamically named property: selectChange(name: string, value: stri ...

node.jstypescripteslint

Get React-table TS up and running on your local machine using VS Code

Objective: I am trying to get React-table working with TypeScript on my local computer. Challenge: The code is based on this page https://codesandbox.io/s/gkzg3?file=/src/makeData.ts However, when I attempt to apply the code on my local computer, I ...

typescriptvisual-studio-codereact-table

Guide to reference points, current one is constantly nonexistent

As I work on hosting multiple dynamic pages, each with its own function to call at a specific time, I encounter an issue where the current ref is always null. This poses a challenge when trying to access the reference for each page. export default class Qu ...

javascriptreactjstypescriptreact-native

Generating and setting an object property in TypeScript at runtime

In my code, I have defined an interface as follows: export interface OurHistory { ourHistory?: object; step1?:object; step2?:object; } Within the HistoryComponent class, I am doing the following: export class HistoryComponent implements OnInit, On ...

angulartypescriptangular7

Retrieving an Enum member based on its value in TypeScript

I am working with an enum called ABC: enum ABC { A = 'a', B = 'b', C = 'c', } In addition, I have a method named doSomething: doSomething(enum: ABC) { switch(enum) { case A : console.log(A); break; case ...

javascripttypescriptenums

When attempting to utilize expo-av in a React-Native project on iOS, the recorded MP4 file encountered an issue when trying to submit it as form data for Open

I've been working tirelessly through the night, trying to record myself on my iPhone using expo-av to capture speech and then upload it to openai's transcriptions endpoint with the whisper-1 model. The recording is saved as an mp4 file, which I ...

typescriptreact-nativeapiexpoopenai-api

What is the process for upgrading TypeScript to the latest version?

Is there a way to upgrade TypeScript version for ASP.net MV5 project in Visual Studio 2015? I attempted searching through Nuget but couldn't locate it. There seems to be an issue with the razor intellisense (index.d.ts file) and I'm hoping that ...

javascriptasp.net-mvctypescriptwebrazor

Navigate to a different page using Angular with a simple click

How can I implement a redirect from clicking on the "Firms" word to another component page in Angular? I have tried using routerLink="/", [routerLink]="['/']". I have imported Routes in the app.module. I have also attempted this approach: import ...

angulartypescriptroutespathclick

How can I add multiple filters to a Kendo Grid?

Is there a way to include two separate filter fields for date filtering in Kendo Grid UI? Currently, the method I am using only allows for one date filter to be displayed. filterable: { ui: function (element: any) { element.ken ...

javascriptangulartypescriptkendo-uikendo-grid

Utilizing React with Typescript: A guide to working with Context

I have a super easy app snippet like import React, { createContext } from 'react'; import { render } from 'react-dom'; import './style.css'; interface IAppContext { name: string; age: number; country: string; } const A ...

reactjstypescript

Tips for expanding a React class using typescript

Let's consider a basic example: interface BaseProps { name: string; } class BaseClass<P extends BaseProps> extends React.Component<P, void> { } interface SuperProps { } class SuperClass extends BaseClass<SuperProps> { } M ...

javascriptreactjstypescript

Is there a way to customize the slicing of *ngFor in a component according to the components it is being injected into?

This code snippet represents a component that needs to be included in other components: <div class="row"> <div class="col-12 [...]" *ngFor="let course of courses"> <div class="card"> ...

javascripthtmlcssangulartypescript

Guide on incorporating typed components into module federation in React

I've been encountering an issue with setting the type of a custom component exposed through Webpack module federation. Though I have successfully exposed and used the component, Typescript is flagging an error regarding its type. The situation invol ...

javascriptreactjstypescriptwebpackwebpack-module-federation

Modify the code in JavaScript without utilizing the keyword "let"

Looking for alternative approaches to avoid using let in this code snippet due to the risks associated with variable reassignment leading to bugs that are hard to debug. Any suggestions? function findNodeById<F extends ISomeOptions>( optionsList ...

typescriptlet

Is there something I'm overlooking? The utilization of FormData and .get from FormGroup seems intriguing

I've encountered some challenges while working on a contact form using Angular Reactive Forms and HttpClient for post requests. There seems to be an issue with the FormData append part, as I'm receiving an error message stating "Object is possibl ...

angulartypescript

After upgrading to node version 20 and other dependencies, encountering ERR_REQUIRE_ESM issue

Attempting to update node from version 16 to 20 has led me to also consider upgrading some other libraries simultaneously. Upon trying to start my backend after completing the updates, the following error occurred: % yarn run dev [nodemon] 3.0.1 [nodemon] ...

node.jsreactjstypescripttsconfig

Issue: Unable to assign value to 'googleUri' property of null. Resolving with Interface for two-way binding?

Can anyone help me figure out why I keep getting a 'set property of null' error while attempting 2way binding in my interface? Whenever I submit the form and trigger the onSave function, I encounter the error "Cannot set property 'googleUri ...

angulartypescriptangular5

Using async-await in canActivate() within Angular 7

I am currently working on a code that verifies whether the browser contains user information. If not, the browser will make an API call to retrieve the user information from the server. Only users with valid information are granted access to navigate to di ...

angulartypescript

Why is it necessary to include the spread operator before an array of objects?

Currently delving into Angular and stumbled upon a code snippet that seems a bit cryptic to me. The function I'm working with returns an array of objects as Observable<Product[]>: connect(): Observable<Product[]> { const dataMutati ...

angulartypescriptangular7

reconfigure components by resetting settings on a different component

In the interface, I have a section that displays text along with a unique component titled FilterCriteriaList. This component includes custom buttons that alter their color when clicked. My goal is to reset the settings in the FilterCriteriaList component ...

javascriptreactjstypescriptreact-nativereact-hooks