Error: The activation of the extension in vscode failed because the module cannot be found using non-relative import

Currently, I am in the process of developing a Visual Studio Code extension. In this project, I have opted to utilize non-relative imports in TypeScript. For instance:

import ModuleA from 'modules/ModuleA';

The actual location of the folder for ModuleA is src/modules/ModuleA. To ensure the proper configuration, my tsconfig.json file includes setting src as the baseUrl:

{
  "compilerOptions": {
    "baseUrl": "./src",
    "module": "commonjs",
    "target": "es6",
    "outDir": "out",
    "noImplicitAny": true,
    "suppressImplicitAnyIndexErrors": true,
    "lib": [
      "es6"
    ],
    "sourceMap": true,
    "strictNullChecks": true,
    "experimentalDecorators": true,
    "moduleResolution": "node"
  },
  "exclude": [
    "node_modules",
    ".vscode-test"
  ]
}

While everything compiles and builds without issues, upon testing the extension, I encounter an error:

Activating extension failed: Cannot find module 'modules/ModuleA'
. My .vscode/launch.json file used for launching the extension appears as follows:

// This configuration compiles the extension and then launches it in a new window
{
  "version": "0.1.0",
  "configurations": [
    {
      "name": "Launch Extension",
      "type": "extensionHost",
      "request": "launch",
      "runtimeExecutable": "${execPath}",
      "args": ["--extensionDevelopmentPath=${workspaceRoot}" ],
      "stopOnEntry": false,
      "sourceMaps": true,
      "outFiles": ["${workspaceRoot}/out"],
      "preLaunchTask": "build",
      "internalConsoleOptions" : "openOnSessionStart"
  }
  ]
}

I am seeking guidance on how to successfully implement non-relative paths for vscode extensions development.

Answer №1

To resolve the issue, I found success in running an npm compile command. This can be achieved by executing a Run Build Task from the command palette (cmd+shift+p), then choosing

npm compile - <extension name>
. Alternatively, you can also perform this task directly in your project directory using the command tsc -p ./

Answer №2

After encountering a similar issue, I decided to reinstall the node with the same version, which surprisingly solved the problem.

My operating system is Mac, so here's what worked for me:

sudo rm -rf /usr/local/lib/node_modules/npm
brew reinstall node

For more details, you can check out the reference link: Error: Cannot find module '../lib/utils/unsupported.js' while using Ionic

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

How can you define the types of function arguments when destructuring arguments in TypeScript?

TS throws an error that states: Error:(8, 20) TS7031: Binding element 'on' implicitly has an 'any' type. Error:(8, 24) TS7031: Binding element 'children' implicitly has an 'any' type. Below is the function I am wor ...

What could be causing the React text input to constantly lose focus with every keystroke?

In my React project using Material-UI library, I have a component called GuestSignup with various input fields. const GuestSignup = (props: GuestSignupProps) => { // Component code goes here } The component receives input props defined by an ...

Tips on how to properly format a DateTime String

I need help with formatting a DateTime string retrieved from an API where it is in the format of YYYY-MM-DDTHH:MM:SS +08:00 and I want to change it to DD-MM-YY HH:MM getDataFromApi(res) { this.timestamp = this.timestamp.items[0].timestamp; console ...

Enhance the appearance of a custom checkbox component in Angular

I developed a customized toggle switch for my application and integrated it into various sections. Recently, I decided to rework it as a component. However, I am encountering an issue where the toggle switch button does not update in the view (it remains t ...

Using Angular: filtering data streams from a date range observable object

I have a piece of code that seems to be functioning correctly, but I can't shake the feeling that it might just be working by chance due to an undocumented feature. I'm torn between questioning its validity or accepting that it is indeed designed ...

Downloading PDF files on IOS while using Angular often results in the PDF opening in the same

I'm currently utilizing file-saver within my Angular application to retrieve a PDF generated from the backend. The library functions smoothly on desktop and Android devices, but I'm encountering issues with downloading files on iOS. Contrary to w ...

What is the best way to modify the disabled attribute?

After disabling a button using a boolean variable, updating the variable does not remove the disabled attribute. How can I update my code to enable the button when the variable changes? Here is my current code snippet: var isDisabled = true; return ( ...

The reason for my inability to include a fresh method in String.prototype using typescript

I attempted to extend the String.prototype with a new method, but I encountered an issue. interface String { newMethod(): void } String.prototype.newMethod = function() {} Although there were no errors in the typescriptlang.org playground, I received ...

What is the reason behind TypeScript treating numbers as strings when adding them together?

Although TypeScript is strongly typed, can you explain why the code below outputs 12 instead of 3? function add_numbers(a: number, b: number){ return a + b; } var a = '1'; var b = 2; var result = add_numbers(<number><any>a, b) ...

typescript Parameter type dependency based on value is not functioning

interface AddDataRequest{ data:any } interface AddDataResponse{ id:string } interface ITest{ addData(json:AddDataRequest):Promise<AddDataResponse> removeData(json:AddDataResponse):Promise<boolean> } function testInterface<A e ...

The error message displayed in the Typescript Playground is stating that there is no property named 'values' on the type 'ObjectConstructor'

Could someone please take a look at this link? I'm encountering an error with the playground and I'm not sure why. Click here ...

Angular loop is unable to detect changes in the updated list

My Angular application is facing a peculiar issue that I can't seem to figure out. // Here are the class attributes causing trouble tenants: any[] = []; @Input() onTenantListChange: EventEmitter<Tenant[]>; ngOnInit(): void { this. ...

What is the best way to determine the data type of one property in an array of objects based on another property

I have been working on creating a straightforward parser that relies on rules provided by the constructor. Everything seems to be running smoothly, but there are some issues with data types. interface RuleBase { parse(text: string, params: Record<stri ...

Managing Data Types in a React and Express Application

I am working on a project that includes both a React client and a Node-Express backend. Currently, my React app is running with TypeScript and I am looking to switch my backend to TypeScript as well. At the moment, my project structure consists of a clien ...

Tips for improving the slow compilation of the Next.js 14 development environment

Currently, I am tackling an issue with my Typescript - Next.js 14 Application where the compilation process in the development environment is taking excessive time, sometimes up to 60 seconds. What steps can be taken to resolve this problem and optimize t ...

Retrieve data that resets to undefined upon reloading from an array

Encountering an unusual error while working with TypeScript for the first time. Initially, when I use console.log(data), it displays an array with objects. However, upon reloading the webpage without making any changes, the console log shows undefined. con ...

Creating TypeScript Classes - Defining a Collection of Objects as a Class Property

I'm trying to figure out the best approach for declaring an array of objects as a property in TypeScript when defining a class. I need this for a form that will contain an unspecified number of checkboxes in an Angular Template-Driven form. Should I ...

The system now alerts that there are no pending migrations when trying to execute them, which previously ran smoothly without any issues

I am experiencing an issue with my web app where the migrator I have written to create tables and relations is not being recognized by TypeORM, preventing it from running. Here is a glimpse of my file structure (specifically the migrations): src> Data ...

Finding the percentage scores for five different subjects among a class

As a beginner in TypeScript, I am still learning the ropes. Here is the code snippet I used to calculate percentage: pere() { this.E=(((+this.English+ +this.Tamil+ +this.Maths+ +this.Science+ +this.Social)/500)*100); console.log(this.E); The result w ...

Is there a method in typescript to guarantee that a function's return type covers all possibilities?

In the case of having a constant enum like: enum Color { RED, GREEN, BLUE, } A common approach is to create a helper function accompanied by a switch statement, as shown below: function assertNever(x: never): never { throw new Error(`Unexpecte ...