Importing Angular libraries with the * symbol

One of the key modules in my library is sha256. To import it, I had to use the following syntax:

import sha256 from 'sha256';

However, while researching this issue, I came across a question on Stack Overflow titled: Errors when using MomentJS in Angular Typescript library

The suggestion was that I needed to handle the import differently during compilation:

I initially changed my import statement to:

import * as sha256_ from 'sha256';
const sha256 = sha256_;

Unfortunately, this also resulted in the same error message:

ERROR: Cannot call a namespace ('sha256')
An unhandled exception occurred: Cannot call a namespace ('sha256')

Next, I attempted to modify my tsconfig.json:

  "angularCompilerOptions": {
    "allowSyntheticDefaultImports": true,
    "fullTemplateTypeCheck": true,
    "strictInjectionParameters": true
  }

Despite making these adjustments, I still encountered issues.

Could someone guide me on how to correctly manage this particular import in my library?

Edit

In addition, I included it in the compilerOptions:

    "compilerOptions": {
    "outDir": "../../out-tsc/lib",
    "target": "es2015",
    "declaration": true,
    "inlineSources": true,
    "allowSyntheticDefaultImports": true,
    "types": [],
    "lib": [
      "dom",
      "es2018"
    ]
  },

ng --version

Angular CLI: 8.3.20
Node: 10.16.0
OS: win32 x64
Angular: 8.2.14
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package                            Version
------------------------------------------------------------
@angular-devkit/architect          0.803.20
@angular-devkit/build-angular      0.803.20
@angular-devkit/build-ng-packagr   0.803.20
@angular-devkit/build-optimizer    0.803.20
@angular-devkit/build-webpack      0.803.20
@angular-devkit/core               8.3.20
@angular-devkit/schematics         8.3.20
@angular/cli                       8.3.20
@ngtools/webpack                   8.3.20
@schematics/angular                8.3.20
@schematics/update                 0.803.20
ng-packagr                         5.7.1
rxjs                               6.4.0
typescript                         3.5.3
webpack                            4.39.2

Answer №1

Give this a shot...

npm install --save @types/sha256

after that

import sha256 from 'sha256';

or

import * as sha256_ from 'sha256';

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

I'd like to know what sets next/router apart from next/navigation

Within Next.js, I've noticed that both next/router and next/navigation offer a useRouter() hook, each returning distinct objects. What is the reasoning behind having the same hook available in two separate routing packages within Next.js? ...

Display information from a specific identifier in a modal popup window after clicking a button using PHP and MySQL

When a button is clicked on my website, a popup window appears using modal functionality. The issue I am facing is not being able to retrieve the correct data based on the id of the button. Below is the HTML table code snippet: <tbody> <?php $cou ...

Issue loading a 300 MB file into BigQuery results in a timeout error

Trying to implement the Node.js example shown in the data post request section (located towards the end here: https://cloud.google.com/bigquery/loading-data-post-request) has hit a snag when dealing with larger files. While the sample code functions proper ...

HookWebpackError: There seems to be an issue with reading the properties of undefined, specifically regarding 'e'. An inner error has occurred, resulting in a TypeError when trying to read properties of undefined for 'e'

I have been using npx-create-react-app for years, but now I am unable to build with npm run build. Even after updating my node and npm and clearing the cache with npm cache clean --force, the projects are still not working. Neither the old ones nor the ne ...

What is the method for rotating a map using JavaScript?

My map built with Leaflet displays a route and a moving car marker. Now, I am looking to implement a feature where the map rotates based on the direction of the car. I have access to both the current coordinates of the car and the target coordinates. ...

lengthy conditional statement in JavaScript

Is there a more efficient way to handle a long series of if-else statements in JavaScript? I'm not experienced enough with the language to optimize this code. Any suggestions or guidance would be greatly appreciated. $('#webform-component-primar ...

Converting JSON POST data in Mocha test for an Express application

When I run my Express code from Postman, everything works perfectly. However, when I try to call it from Mocha, I encounter issues specifically with setting data in the header of a POST request. This problem only occurs with POST requests containing parame ...

Trouble encountered during installation of Angular CLI: module.js - code 549

I recently encountered issues with Angular-CLI, so I decided to update it using the command $ npm install -g @angular/cli. However, after doing so, I am facing a new error message. Can anyone provide assistance with this problem? module.js:549 throw err ...

Encountering issues while running the npm build command due to exporting async functions in React

In my React project, I am utilizing async functions and have created a file named apiRequest.js structured like this: const axios = require('axios'); const serverURL = "http://localhost:8080" getInfo = async function ({email}) { try { r ...

The angular application is experiencing issues with the injection not functioning correctly

In my MVC application, I have an Angular application that I want to extract and turn into a standalone application. I created a new minimal version of the Angular application using CLI, copied over the package.json file, installed all necessary packages, ...

Guide on setting default attributes for all properties of an object at once

Currently, I'm in the process of developing an AngularJS service provider (function) that achieves the following objectives: Gathers data from multiple tables within an SQLite database Delivers the resulting object to various controller functions S ...

Enhancing the efficiency of JavaScript code

Imagine you have a web application processing 1,000,000 user logins per hour. and the code below is executed during each user login: if (DevMode) { // make an Ajax call } else if (RealMode) { // make another Ajax call } else { // Do something ...

Is there a way to compel @keyframes to continue playing until it reaches its conclusion even after a mouseout event

Whenever I hover over an element, a keyframe animation starts playing. However, when I move the cursor away, the animation stops abruptly. Is there a way to ensure that it plays until the end? I've tried using the animationend event, but it doesn&apos ...

Incorporating an HTML file into a DIV container while also displaying menu links

I am facing a major challenge with what I recognize as a relatively simple issue for experts. As someone who is still learning, I am struggling to create menu links that load an HTML file into a specific DIV. Despite my efforts, the content keeps loading i ...

Verify if the array entries match

Within my select element, I populate options based on an array of values. For example: [{ name: 'A', type: 'a', }, { name: 'B', type: 'b', }, { name: 'B', type: 'b', }, { name: &apos ...

Tips for creating a Single Xpath instead of Multiple paths

I'm currently working with Protractor alongside TypeScript. I have an element located at: xpath = "**//div[@class='loglist']/div[1]/div[2]**" Afterwards, there are additional elements that need to be identified in different divs s ...

Incorporating middleware to handle 404 errors in Express

scenario app.use("/api/tobaccos", tobaccos); app.use(function(err, req, res, next) { console.error(err.message); }); API details: router.get("/:id", async (req, res) => { console.log("GET TOBACCO:" + req.params.id); ...

What is the best way to run code once a callback function has completed its task?

I am looking for a way to execute line(s) of code after every callback function has finished processing. Currently, I am utilizing the rcon package to send a rcon command to a Half-Life Dedicated Server (HLDS) hosting Counter Strike 1.6 server and receive ...

button that takes you back to the top of a mobile website

I want to customize the Scroll To Top button so that it only appears once the user begins scrolling down, rather than always being visible even when at the top of the page. Just a heads up, I don't have much experience with JavaScript, so I might need ...

Having trouble decoding JWE using the NPM Jose library

Although I can successfully decrypt a JWE using an older version of jose, I'm facing difficulties in utilizing the latest version API. The headers of my token are as follows: { "alg": "A128KW", "enc": "A128CBC-H ...