无法使用 Angular 2 导入 toastr 模块

2023-12-12

我正在创建版本为 2.0.0-alpha.46 的 Angular 2 应用程序,并尝试导入 toastr 模块。

我已经下载了该库,还下载了明确键入的文件。

在我的 html 页面中,我添加了一个<script>.js 文件的标签:

<script src="./src/libs/toastr/toastr.min.js"></script>

在 Visual Studio Code 中,我尝试像这样导入模块:

import * as toastr from 'toastr';

然后我可以在我的组件中调用 toastr.info('message') - 我什至获得智能感知;但是,当我实际尝试加载网页时,我收到 404 /src/toastr not found 错误。

如果我尝试明确查找 toastr 明确键入的文件:

import * as toastr from '../../definitions/toastr/toastr';

我会得到“[ts 模块的完整路径]不是一个模块。”

我也尝试过添加///<reference path="../../toastr.d.ts" />到我用来导入模块的文件顶部却无济于事。

有人知道可能会发生什么吗?我对我可能做错的地方一无所知。提前致谢。


我认为toastr.min.js文件根本不包含模块。我的理解是,TypeScript 定义文件可以帮助您定义 toastr 库使用的方法和结构。这对于 IDE 中的代码完成很有帮助。这个定义文件实际上并没有创建一个可以在运行时使用的模块......

这意味着您可以直接使用toastr直接对象,无需像这样导入:import * as toastr from '...';.

这是相应的 plunker:https://plnkr.co/edit/wzdoisKBrZYTeSX8r7Nd?p=preview.

希望这是有道理的。 蒂埃里

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

无法使用 Angular 2 导入 toastr 模块 的相关文章

  • Angular 5 中使用 rxjs 进行持久订阅

    我对 Angular 5 中的 rxjs 仍然有点陌生 并且很难表达我的问题 我仍然希望得到一些提示 我经常会得到相同的设置 多个组件显示相同的数据 访问数据的单个服务 现在通过 Observables 接收数据时我有 2 个选择 a 订阅
  • 如何使用 TS 配置 CRA 以支持 nullish-coalescing-operator

    所以我开始了一个新的 CRA 项目 我正在使用 TS beta 来获得一些不错的功能 例如链接运算符 但我也想使用nullish coalescing operator ifExists elseUseThis 不幸的是它不能开箱即用 并告
  • mat-tab-group 不是 Angular 9 中的已知元素

    我正在使用 Angular 9 和 Angular Material 9 2 4 我正在尝试使用mat tab 组在我的 component html 中 但我不断收到错误 mat tab group is not a known elem
  • Webpack 在 Angular 的 ng 服务中的作用

    我是 Angular 的新手 想知道当我们为应用程序提供服务时 Webpack 在幕后扮演什么角色 在最初的印象中 我开始知道 webpack 是一个构建和打包工具 它将所有必需的 JS 文件分组到单独的包中 然而 我无法找到 webpac
  • 无法在 Angular 10 中的“pdf-viewer”=>“ng2-pdf-viewer”中显示 blob url

    我有一个 API 它将上传的文件作为 blob 返回 当我尝试绑定时src如果使用 blob URL 则它不会显示任何内容 但是 当我尝试绑定直接 URL 时 它可以显示 PDF 文件 这是我下面给出的代码 我的 TS 代码 downloa
  • Angular 6 Asp.Net(非 Core)Web Api CORS 请求失败

    我正在构建一个 Net Web Api 它将由 Angular 6 客户端使用 但出于某种原因 我无法使其在我的开发环境中工作 我从一个非常简单的 Web Api 开始 它只返回一个字符串 用于前端和后端测试目的之间的通信 GET api
  • 多重混合助手会导致意外的不可分配编译器错误。我做错了吗?

    我正在尝试输入一个多混合辅助函数 该函数接受构造函数的映射并返回用一些新接口扩展的那些构造函数的映射 考虑以下设计的基类 class Alpha alpha string alpha class Beta beta string beta
  • Angular 2 - 突出显示更新的表格单元格

    如何在表中刷新改变其值的单元格 tr td product productName td td product price td tr 在组件中我有产品的输入 Input products Array
  • 获取“回调 URL 与 Auth0 不匹配”

    我有一个 Auth0 客户端 配置了以下回调 URL http 本地主机 4200 http localhost 4200 我可以正常登录 问题是当我导航到应用程序中的某个 URL 时 http localhost 4200 places
  • http.put 请求在 Angular2 中执行两次

    我正在尝试更新从我的 Angular2 应用程序调用 API 的公司记录 我在调试时注意到 http 调用被执行了两次 我找到了另一个堆栈溢出线程 https stackoverflow com questions 37241294 ang
  • 无法在 Angular 4 中使用自定义主题

    我正在尝试在我的角度项目中使用我的自定义主题 它没有按预期工作 我收到以下错误 node modules css loader sourceMap false importLoaders 1 node modules postcss loa
  • 如何在 inversify 中注入异步依赖?

    我有 TypeScript 应用程序并且正在使用反转 http inversify io 对于国际奥委会 我有一个连接类 use strict import injectable from inversify import createCo
  • 类型“HTMLElement”上不存在属性“connectedCallback”

    我有一个项目 一年后我又回来了 类似于下面的代码的东西曾经有效 但现在不再有效 interface HTMLElement attributeChangedCallback attributeName string oldValue str
  • 类型“never”上不存在属性“click”。 TS2339

    根据有关 TypeScript 此类错误的其他类似问题 关于问题 44147937 https stackoverflow com questions 44147937 property does not exist on type nev
  • ngrx 存储是否持久?

    ngrx 存储是否持久 换句话说 我们可以关闭浏览器重新打开它 并检索添加到ngrx 商店 https github com ngrx platform 目前 ngrx store 不支持此类功能 但是您可以通过使用类似的库来维护状态ngr
  • 避免在 Angular 2+ 中嵌套订阅?

    我有2个端点 1 个端点来获取当前用户的日志 1 个端点来获取该用户的授权 实际上我使用 this user subscribe e gt this grants get e subscribe x gt console log x 但这是
  • 如何更改元素的 CSS 类并在单击时删除所有其他类

    我如何处理 AngularJS 2 中的一种情况 即单击一个元素需要更改其自己的样式 并且如果其他元素具有该样式 则需要将其删除 最好在一个函数中 如同Angular js 如何在单击时更改元素 css 类并删除所有其他元素 https s
  • 第二个函数参数的条件类型

    我有以下功能 function doSomething param1 string param2 string return param1 param2 我也有基于 json 的类型 其结构看起来与此类似 a1 b1 something1
  • 415 不支持的媒体类型; Angular2 到 API

    我是 Angular 2 的新手 我面临着一个无法找到解决方案的问题 当我尝试从 Angular 2 发布到 API 时 我得到 415 不支持的媒体类型 角度2代码 onSubmit value any console log value
  • Angular2 Router:将主题标签添加到 url

    我正在使用 Angular2 Seed 应用程序 您可以在官方仓库 https github com mgechev angular2 seed 正如您所看到的 这里我们导入了 angular2 router 并且我们使用它来创建应用程序的

随机推荐