将Javascript库(jsencrypt)导入Angular 2应用
我已经看过了围绕这个问题的所有教程，但都没有找到解决方案。先介绍一些背景知识。我有一个Angular 2应用程序，我需要使用这个JS库进行加密：https://github.com/travist/jsencrypt
首先，我用一行代码安装了jsencrypt节点模块: npm install --save jsencrypt。这起作用了，jsencrypt模块可以在我的node_modules文件夹中找到。
一些教程告诉我创建一个src/typings.d.ts文件，然后添加以下行:声明模块'jsencrypt'；
然后，在我的comonents.ts文件中，我用下面这行代码导入它: import * as JSEncrypt from 'jsencrypt'；
我还尝试添加< script src="/node_modules/jsencrypt/bin/jsencrypt.js">< /script>
添加到我的.html文件中。
在我的.component文件的初始化部分，我尝试声明一个简单的JSEncrypt对象: var decrypt = new JSEncrypt()；
控制台显示这个错误: TypeError: Object不是一个构造函数(计算'new WEBPACK_IMPORTED_MODULE_4_jsencrypt()')
所以我假设它不能识别jsencrypt模块。
我使用Angular只有几天的时间，所以我对所有的术语和对Angular应用程序的结构组件的基本理解都非常陌生。任何帮助都是非常感谢的。
使用本教程作为起点：https://hackernoon.com/how-to-use-javascript-libraries-in-angular-2-apps-ff274ba601af
回答 3
Stack Overflow用户
发布于 2018-07-20 10:06:30
对于之前需要使用的任何其他Javascript模块，我都使用了相同的步骤，并且一切正常。
保存新的project_name
- cd project_name
- npm安装-- jsencrypt
正如您所提到的，在这一点上，您已经有了一个完全工作的Angular应用程序，至少在node_modules中安装了jsencrypt包。接下来的步骤是去掉Typescript编译消息，尽管你可以跳过它们，它仍然可以工作：
在src文件夹中，创建一个名为@types的文件夹，并在其中创建另一个包名为jsencrypt的文件夹，最后，在其中创建一个index.d.ts。这样：
- application_root_folder/src/@types/jsencrypt/index.d.ts
文件的内容应该只是模块的声明：
declare module 'jsencrypt';最后，为了在任何.ts文件中使用该包，例如在我的示例app.component.ts文件中，您可以导入模块并使用它：
import { Component } from '@angular/core';
import * as JsEncryptModule from 'jsencrypt';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = 'app';
constructor() {
var encrypt = new JsEncryptModule.JSEncrypt();
console.log(encrypt);
}
}您可以在浏览器控制台上查看是否有一个对象，其中包含模块/包提供的所有属性和方法：
我不会详细介绍包的用法本身，因为我没有意识到这一点，我认为这不是问题的重点。我希望它能有所帮助！
Stack Overflow用户
发布于 2020-12-11 00:40:01
在react (创建react应用程序)中，使用.d.ts打开此文件
并添加此行declare module 'jsencrypt';。
Stack Overflow用户
发布于 2020-10-01 01:12:41
import { JSEncrypt } from 'jsencrypt';尝尝这个。它只导入JSEncrypt类。
https://stackoverflow.com/questions/51432735
复制相似问题