如何使用StackBlitz编辑器“导入”TypeScript模块

Question

如果我进入Stackblitz.com编辑器并创建一个新的Angular项目，它会提供一些默认文件，文件夹等。

在“依赖关系”区域下，我想安装shortid。因此，我将其键入框中，并通过加载正确版本的动作。在那一点上，一切都很好。

然后，在app.component.ts文件中，我理解这可以“导入” - 但是以下任何组合都会失败并显示消息“无法找到模块'短信'。”

import * as sid from 'shortid';
import { generate } from 'shortid';
import "/node_modules/shortid";
import shortid = require("shortid");

以下内容不会产生错误，但似乎也没有公开任何shortid函数。

import 'shortid';

StackBlitz在这方面是否被打破？或者我做错了什么？

Answer 1

有些软件包没有默认导出，因此您需要：

import * as shortid from 'shortid';

使用StackBlitz：https://stackblitz.com/edit/angular-kr9x7m

编辑：我误解了你的问题。 IntelliSense对我来说也不起作用，但是shortid正在按预期工作。

Answer 2

仅作为对有此问题或类似问题的任何人的注释，并最终解决了该问题；即使Stackblitz抱怨它无法识别模块，在运行代码时它仍然可能起作用。该错误消息可能仅是由于浏览器中的安全功能（在浏览器控制台中，您可能会看到类似

Failed to execute 'postMessage' on 'DOMWindow': The target origin provided does not match the recipient window's origin ('https://stackblitz.com').

您通常可以忽略它而只运行代码

Answer 3

关闭我的申请并重新打开对我有用。