编译器无法从 node_modules/@types 中找到类型

Question

我尝试从我的 node_modules 加载 P5 类型，但是当我编译我的代码时，终端返回此编译错误消息

Module not found: Error: Can't resolve 'p5' in '/Users/stan/En_cours/code/github/P5JS_TypeScript_WebPack/Template_V2/src'
 @ ./src/sketch.ts 2:0-25 23:18-20

要在我的代码中导入我使用import * as p5 from "p5";，但是当我阅读日志时，编译器会尝试直接在src 文件夹中搜索，我找不到要求进入@ 中的好文件夹的解决方案987654328@.

有关信息，我是 TypeScript、NPM、Webpack 的初学者...

我也试过

import p5 from "../node_modules/@types/p5";
import * as p5 from "./node_modules/@types/p5";

我找到了这些链接，但没有找到可行的解决方案。

https://www.typescriptlang.org/docs/handbook/module-resolution.html

Import from installed @types?

https://github.com/Microsoft/TypeScript/issues/16472

在我的package.json 我有

"devDependencies": {
    "@types/p5": "^0.9.0
    .../...
},

Answer 1

我解决了部分问题。这是打字稿版本的问题，不知为何我的package.json 中的版本不是好版本，所以我用好的版本代替。另外还有一个导入p5 的问题，比如@ChristopherChiche 并且知道问题是export.js 的大小，现在它大约是8MG，而不是之前的10K，并且索引没有导出:(

我认为在导出过程中添加了P5，不确定但闻到了。如果是这样，如何不导出p5因为我不需要，因为在html中写的是<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.9.0/p5.js"></script>

链接项目： https://github.com/StanLepunK/P5JS_typeScript_webPack/tree/master/Template_V2

export.js  8.49 MiB       0  [emitted]  [big]  export
Entrypoint export [big] = export.js
[1] (webpack)/buildin/global.js 472 bytes {0} [built]
[2] ./src/sketch.ts + 1 modules 1.27 KiB {0} [built]
    | ./src/sketch.ts 826 bytes [built]
    | ./src/Z_Position.ts 468 bytes [built]
    + 1 hidden module

WARNING in configuration
The 'mode' option has not been set, webpack will fallback to 'production' for this value. Set 'mode' option to 'development' or 'production' to enable defaults for each environment.
You can also set it to 'none' to disable any default behavior. Learn more: https://webpack.js.org/concepts/mode/

WARNING in asset size limit: The following asset(s) exceed the recommended size limit (244 KiB).
This can impact web performance.
Assets:
  export.js (8.49 MiB)

WARNING in entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (244 KiB). This can impact web performance.
Entrypoints:
  export (8.49 MiB)
      export.js


WARNING in webpack performance recommendations:
You can limit the size of your bundles by using import() or require.ensure to lazy load some parts of your application.
For more info visit https://webpack.js.org/guides/code-splitting/

Answer 2

安装包时，您可能需要安装类型（TypeScript 使用它来了解您使用的实体的类型）。

但是，最重要的部分是您还加载了包本身。所以你必须这样做

npm install p5

或

yarn install p5

现在，如果 p5 在模块中没有任何类型，那么您也需要安装 @types/p5。

我希望它有所帮助。