从 Angular cli 中包含 Projector.js答案

【问题标题】：Include Projector.js from the angular cli从 Angular cli 中包含 Projector.js
【发布时间】：2017-10-06 05:01:57
【问题描述】：

我正在开发一个基于 Angular cli 的应用程序，其中使用了 three.js。我可以将three.js 与import * as THREE from 'three'; 一起使用但我也想添加Projector.js。我在.angular-cli.json中添加了以下代码，

"scripts": [ 
        "../node_modules/three/build/three.js",
        "../node_modules/three/examples/js/renderers/Projector.js"        
      ],

我想创建一个投影仪对象，例如，

projector: any = new THREE.Projector();

我的浏览器控制台出现错误，

THREE.Projector has been moved to /examples/js/renderers/Projector.js.

如何在 Angular cli 应用程序的组件中使用 projector.js？

【问题讨论】：

【解决方案1】：

这不是您在 Angular 项目中添加 three.js 的方式。
你错过了打字，所以一旦你安装了tree.js，你要做的是：

yarn add @types/three -dev 或 npm install @types/three --save-dev

您还必须从scripts 部分取出您的three.js 和Projector.js 参考。

您的错误THREE.Projector has been moved to /examples/js/renderers/Projector.js. 意味着Projector 事物已从核心移至示例。

/examples/js/renderers/Projector.js 只是一个例子的名字文件。所以你必须将Projector.js 的内容整合到一个角度组件中。

类似的东西：const raycaster = new THREE.Raycaster(); const mouse = new THREE.Vector2(); 可以正常工作。

【讨论】：

我尝试这样做，但仍然收到相同的错误消息。您的意思是将Projector.js 的内容复制/粘贴到我的组件中吗？你能解释一下吗？怎么做。
@srijishks 我刚刚澄清了答案的那一部分。基本上你必须将代码转换成角度组件，就好像你只是复制粘贴它可能不起作用。
这个应该有three.js标签吗？它看起来更像是一个 javascript/typescript/ 构建系统/角度问题，恰好尝试从三个（可能是任何其他库）导入一个模块
npm install tree, npm install @types/three --save-dev 然后你可以通过像const raycaster = new THREE.Raycaster(); const mouse = new THREE.Vector2();一样导入import * as THREE from 'three'; 在你的组件中使用它