Playwright script encounters module not found error

I am currently facing an issue with implementing Playwright in my project. It seems that Playwright is struggling to a) resolve path aliases and b) it is unable to locate certain npm packages that have been installed.

Here is the structure of my project:

.
├── node_modules
├── package.json
├── playwright.config.ts
├── src
└── tests
    └── e2e
        └── sign-in.e2e.js

Snippet from the tsconfig.json file:

"compilerOptions": {
  "baseUrl": ".",
  "paths": {
    "@/src/*": ["./src/*"]
  }
},

Answer №1

My configuration is quite similar to yours, with a slight variation in the setup:

"compilerOptions": {
  "baseUrl": ".",
  "paths": {
    "src/*": ["src/*"],
    "tests/*": [tests/*]
  }
},

I have found some support for this structure in the official documentation. I also noticed that @src/* is not a commonly used path.

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

Encountered an issue while attempting to install the pm2 module for nodejs

Having trouble installing the pm2 module on Ubuntu 14.04 Beta2 with Node.js version 0.10.25 and npm 1.4.7. What could be causing this error? halkar@halkar-nb-ubuntu:~/source$ sudo npm install pm2 -g ....... npm http 304 https://registry.npmjs.org/fseven ...

The InAppBrowser seems to have trouble loading pages with cookies when I attempt to navigate back using the hardware back button

In my Ionic/Angular application, I utilize the InAppBrowser plugin to access a web application for my company. The InAppBrowser generally functions properly; however, there is an issue with a cookie within the web application that controls filters for cert ...

What's the best way to insert values into data binding within a Typescript/ Angular mat Table?

Objective: Create a dynamic table using JSON data <mat-table class="mat-elevation-z8" *ngIf="carrierRates" [dataSource]="carrierRates"> <ng-container *ngFor="let columnName of columnsList" matColumn ...

How can I remove specific items from a PrimeNG PickList?

Currently, I'm working on a page where updates are made using PrimeNG PickList. The initial state of the target list is not empty, but when selected items are moved from source to target list, they are not removed from the source list as expected. Fr ...

The Ionic project compilation was unsuccessful

Issue: This module is defined using 'export =', and can only be utilized with a default import if the 'allowSyntheticDefaultImports' flag is enabled. Error found in the file: 1 import FormData from "form-data"; ~~~~~~~~ node ...

The SrollToTop function is ineffective when used with a component in Ionic 6/Angular

Recently, I implemented a fabbutton feature that allows users to scroll to the top of a page with just one click. Initially, I tested this functionality without using it as a component, and everything worked perfectly. However, now I want to turn this fabb ...

Tips for bringing in Cassandra driver types in TypeScript?

In the documentation for the Cassandra driver, they provide code examples like this: const Uuid = require('cassandra-driver').types.Uuid; const id = Uuid.random(); However, when attempting to use this in Visual Studio Code, the Uuid class type ...

Infinite Loop Issue in Angular2 RC5 when using the templateUrl

Encountering an issue with Angular2 RC5 that seems to be causing an infinite loop problem. The app.component, which is bootstrapped by the app.module, appears quite simple: @Component({ selector: 'my-app', template: `TEST` }) export cl ...

Failed to install NPM

I just updated my nodejs to the latest version on Windows. However, when I try to install packages with the npm install command, it installs some packages but then gives me an error. npm WARN optional Skipping failed optional dependency /chokidar/fsevent ...

Creating a TypeScript schema with nested maps and arrays using Dynamoose

I'm currently in the process of developing a schema for a specific example: { "foods": [ { "fruits": [{ "apple": { "color": "red", ...

Tips for transferring data from a service to a method within a component

I have a service that successfully shares data between 2 components. However, I now need to trigger a method in component A when an event occurs on the service (and pass a value to that component). Can someone guide me on how to achieve this? I have seen ...

Exploring the use of a customizable decorator in Typescript for improved typing

Currently, I am in the process of creating TypeScript typings for a JavaScript library. One specific requirement is to define an optional callable decorator: @model class User {} @model() class User {} @model('User') class User {} I attempted ...

Feeling a bit lost when trying to kickstart a project in node.js and utilizing npm install

Greetings, I am currently in the process of learning and consider myself a beginner. Recently, I explored the chat tutorial from the get-started section on socket.io. As I continue to expand my knowledge by exploring other resources, one question remains ...

Initiating npm results in the package manager console being frozen with the message, "Press ^C at any time to quit."

Whenever I attempt to type "npm init" in the package console manager, it initiates the process, but the console seems to be frozen with the message: "Press ^C at any time to quit.". This prevents me from creating my package.json file, leaving me completely ...

The ko.mapping function is throwing an error because it cannot access the property 'fromJS' which is undefined

I am currently exploring typescript and attempting to integrate knockout.mapping into my project, but I'm facing some challenges. Despite installing the necessary libraries for knockout and knockout.mapping, along with their respective "@types" decla ...

add headers using a straightforward syntax

I'm attempting to append multiple header values. This is what I'm currently doing: options.headers.append('Content-Type', 'application/json'); options.headers.append('X-Requested-By', 'api-client'); ... ...

Looking to retrieve CloudWatch logs from multiple AWS accounts using Lambda and the AWS SDK

Seeking guidance on querying CloudWatch logs across accounts using lambda and AWS SDK Developing a lambda function in typescript Deploying lambda with CloudFormation, granting necessary roles for reading from two different AWS accounts Initial exe ...

Enhancing RxJS arrays of Observables with supplementary data for preservation

Question: Processing Array of Observables with Metadata in Angular How can I process an array of Observables, such as using forkJoin, while passing additional metadata for each Observable to be used in the pipe and map functions? const source = {animal: & ...

The React application is experiencing delays in launching the development server

I have implemented a react dashboard template that I purchased from a themeforest. Here is the snapshot of the package.json: { "name": "acorn-react", "version": "1.0.1", "private": true, "proxy&quo ...

Having trouble starting the server? [Trying to launch a basic HTML application using npm install -g serve]

I am in the process of creating a PWA, but I haven't reached that stage yet. Currently, I have only created an index.html file and an empty app.js. To serve my project locally, I installed serve globally using npm install -g serve When I run the co ...