无法将 pixi.js 导入 .ts 文件

Question

我是 pixi.js 的新手。我是第一次尝试使用它，所以我通过npm install pixi.js --save-dev 安装了它，即使它在我的 package.json 中添加了 pixi.js 依赖项，但在尝试导入它时它不起作用。由于某种原因，在 node_modules 文件夹中也找不到 pixi.js。 我已经尝试卸载软件包然后重新安装，但仍然在 node_modules 中找不到它。

需要注意的是，我已尝试导入我也通过 npm 安装的 DefinetlyTyped 版本的 pixi.js，但该版本缺少 pixi.js 的一些定义，这就是我需要原始 pixi.js 的原因导入到我的 TypeScript 项目中。甚至可以通过 TypeScript 使用 .js 库吗？ （我想我应该是，因为 TypeScript 也可以使用 JavaScript 代码）

我尝试将 pixi 导入为： import * as PIXI from 'pixi.js'; import PIXI from 'pixi.js'; var PIXI = require('pixi'); var PIXI = require('pixi.js');

我正在尝试从位于 node_modules 之外的名为“ts-src”的文件夹中的 app.ts 访问 pixi.js，这可能是问题所在吗？ （我不这么认为，但不得不问）。

Answer 1

如果您安装了 pixi.js，请确保您也安装了 @types/pixi.js 包，它为 pixi.js 提供类型定义。现在，当您在依赖项中拥有 pixi.js 时。那么剩下的就是将 pixi.js 包含在 HTML 中

<script src="../node_modules/pixi.js/dist/pixi.min.js"></script>

现在在您的 app.ts 中，您可以执行类似的操作

import { Application, Point } from 'pixi.js';
//.....Some code    
const point = new Point(10, 20);

如果您在通过类型定义使用某些 pixi.js 组件时遇到问题。然后在您的源文件夹中创建一个 index.ts 文件并使用

进行更新

import * as PIXI from 'pixi.js';
export { PIXI };

现在在您的应用代码中，您可以直接执行此操作

const label = new PIXI.Graphics();