Issue in Angular typescript: Module aspnetcore-https cannot be located

My package.json file includes:

{
  "name": "projName",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "prestart": "node aspnetcore-https",
...

Upon running npm start, I encounter the following error:

Error: Cannot find module '...\aspnetcore-https'

How can I go about installing this module?

Attempting to install it using the command:

npm install  aspnetcore-https

Results in the following error:

npm ERR! code E404
npm ERR! 404 Not Found - GET https://registry.npmjs.org/aspnetcore-https - Not found

It seems that I have this line in the package.json file because I copied it from a Visual Studio Angular Typescript project to a Typescript-only source code folder. However, shouldn't the latter project still function correctly if I install the appropriate package?

Update: The project runs successfully with npm start after removing the line:

"prestart": "node aspnetcore-https",

But I'm curious to know why I'm unable to install this module.

angulartypescriptasp.net-corepackage.json

Answer №1

When you set up Visual Studio, it automatically adds a file called aspnetcore-https.js to the ClientApp folder. Usually, this file is not included in source control. However, it seems that the file is missing from your project folder.

Here is the content of the file:

// This script sets up HTTPS for the application using the ASP.NET Core HTTPS certificate
const fs = require('fs');
const spawn = require('child_process').spawn;
const path = require('path');

const baseFolder =
  process.env.APPDATA !== undefined && process.env.APPDATA !== ''
    ? `${process.env.APPDATA}/ASP.NET/https`
    : `${process.env.HOME}/.aspnet/https`;

const certificateArg = process.argv.map(arg => arg.match(/--name=(?<value>.+)/i)).filter(Boolean)[0];
const certificateName = certificateArg ? certificateArg.groups.value : process.env.npm_package_name;

if (!certificateName) {
  console.error('Invalid certificate name. Run this script in the context of an npm/yarn script or pass --name=<<app>> explicitly.')
  process.exit(-1);
}

const certFilePath = path.join(baseFolder, `${certificateName}.pem`);
const keyFilePath = path.join(baseFolder, `${certificateName}.key`);

if (!fs.existsSync(certFilePath) || !fs.existsSync(keyFilePath)) {
  spawn('dotnet', [
    'dev-certs',
    'https',
    '--export-path',
    certFilePath,
    '--format',
    'Pem',
    '--no-password',
  ], { stdio: 'inherit', })
  .on('exit', (code) => process.exit(code));
}

Answer №2

When extracting this particular package file from a Visual Studio application, it suggests that a custom project generator (different from @angular/cli) was utilized, which might include a unique file named aspnetcore-https.js.

If you relocate the package file from its initial directory, it may lose access to this specific file, resulting in an unresolved issue.

Therefore, this seems to be the root cause of the problem.

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

Angular - Implementing validation for maximum character length in ngx-intl-tel-input

Utilizing the ngx-intl-tel-input package in my Angular-12 project multistep has been quite promising. Below is a snippet of the code: Component: import { SearchCountryField, CountryISO, PhoneNumberFormat } from 'ngx-intl-tel-input'; expor ...

angulartypescriptangular-reactive-formsngx-international-phone-number

Clearing the filename in a file type input field using React

When using this input field, only video files are accepted. If any other types of files are uploaded by enabling the "all files" option, an alert will be displayed. While this functionality is working correctly, a problem arises if a non-video file is adde ...

javascriptreactjstypescriptinput

When working with a union type in TypeScript, it is important to note that the property may

Imagine a scenario where I am dealing with two specific interfaces: interface Box { x: number y: number } and interface ColouredBox { x: number y: number colour: string } For the sake of this discussion, let's assume that the ...

typescriptunion-types

Encountering "Object is possibly undefined" during NextJS Typescript build process - troubleshooting nextjs build

I recently started working with TypeScript and encountered a problem during nextjs build. While the code runs smoothly in my browser, executing nextjs build results in the error shown below. I attempted various solutions found online but none have worked s ...

reactjstypescriptnext.jsreact-typescript

Reaching the maximum request threshold

Currently, I am facing an issue where users are able to upload files from the client side (using Angular 4) to the server (implemented with Spring Boot). The problem arises when a user attempts to upload more than 6 files at once. In such cases, Chrome uti ...

javascriptajaxangulargoogle-chromebrowser

Unique Version: Some effective tips for utilizing a fork of type definition such as @types

Currently, I am utilizing Typescript 2.0 along with @types and the experience has been quite positive. Thanks to @types, we can easily leverage type definitions by simply installing the package via npm. Surprisingly, I have not delved into how it actually ...

typescript

The enigma of the Angular2 Object's Undefined nature

Encountering an "object undefined" error when trying to access the object of the Service Component. Interestingly, hard coding the data directly into a JavaScript variable works fine and shows the type as "object Array." Data.json [ { "id": ...

typescriptangular

Using useRef as a prop in React with TypeScript

I am currently experimenting with TypeScript and encountering an issue when trying to use useRef in a custom element specifically when passing it as a prop I have attempted the following: import React from "react"; export interface InputProps extends ...

reactjstypescript

What is the best way to capture the current state of Angular's components?

Creating an estimate application using angular-cli, I have a unique concept where users can add a dynamic number of child components. It is essential to store the state and data of these components for future edits and exports. ...

angular

Template for event cell details in Angular2 calendar view

Currently utilizing [angular-calendar] from github.com/mattlewis92/angular-calendar . My goal is to incorporate my own template as a detailed view for events. I am aiming to achieve a similar effect as shown in the image: final effect So far, I ha ...

javascriptangulartemplatestypescriptcalendar

What is the best way to retrieve props for computed properties using Vue with Typescript?

Seeking help on accessing props data for my computed property. Here is the code snippet: <script lang="ts"> import { defineComponent } from 'vue' export default defineComponent({ props: { color: String, shape: String, ...

typescriptvue.js

The latest version of IntelliJ Idea Ultimate, 2023.2.5, does not offer compatibility with the updated control flow features in Angular

I recently made the switch to Angular 17 in my project and noticed that Idea is not recognizing the new syntax in HTML templates. <mat-menu #menu="matMenu"> @for (menuItem of getData().menu.items; track menuItem) { & ...

angularintellij-idea

Inquiring about Vue 3 with TypeScript and Enhancing Types for Compatibility with Plugins

I've been struggling to find a working example of how to implement type augmentation with Vue3 and TypeScript. I have searched for hours without success, trying to adapt the Vue2 documentation for Vue3. It appears that the Vue object in the vue-class ...

typescriptvue.jsvuejs3

Using conditional styles with Angular 2

I am currently working on applying conditional styles to a table. For instance, if a user's "obsolete" property is true, I want to display their information with a <del> tag. I have searched online for solutions, and while I am aware of using *n ...

angularstylesconditional-statements

Combining enum values to create a new data type

Exploring the implementation of type safety in a particular situation. Let’s consider the following: const enum Color { red = 'red', blue = 'blue', } const enum Shape { rectangle = 'rectangle', square = 'square ...

typescriptenumsunion-types

React 18 update causes malfunctioning of react-switch-selector component

I'm facing an issue where the component is not rendering. I attempted to start a new project but it still didn't work. Is there a solution to fix this problem or should I just wait for an update from the original repository? Encountered Error: ...

reactjstypescriptnpmreact-hooks

The conflict between Apple App Site Association and an angular route is causing issues

Can someone provide guidance on setting up an iOS app link to work with Angular? My goal is to include a link in emails sent to users that will open the app if it's installed. I've placed a file named 'apple-app-site-association' witho ...

iosangularazureazure-static-web-appapple-app-site-association

Client side is receiving an unexpected format from the pyramid when using the __json__ method

As I'm configuring a Pyramid back-end along with an Angular front-end application, I encounter an issue. When Angular sends an http GET request to Pyramid, the data received on the Angular side is not as expected. It seems like the id is being recogni ...

pythonjsonangularpyramid

Utilizing Business Logic in a MEAN Stack Environment

When developing an Angular application, where should the calculations take place - on the front end or back end? Considering that the outputs need to update with each input change, is it practical to send a request to the back end every time there is an ...

node.jsangular

Tips for dynamically displaying Angular Material tags within an Angular component using JSON data

I received a JSON response structured like this: { _id: '5dd0d0dc4db1cf9c77781aaa', picture: 'http://placehold.it/32x32', name: 'Graciela Mcmahon', guid: '98c0fcc2-1dfc-4974-bdae-d8263d783e0a&ap ...

angulartypescriptangular-materialowl-carousel