在Angular2中使用three.js

我正在嘗試將three.js場景整合到角2頁。我是Angular 2和javascript的初學者，我在腳本標記，index.html和scene.component.ts文件中包含了three.js文件，我有這樣的代碼...在Angular2中使用three.js

//scene.component.ts 
import { Component } from 'angular2/core'; 
import { THREE } from 'three-js/three'; 
@Component({ 
    selector: 'ps-scene', 
    templateUrl: 'app/webgl/scene.component.html' 
}) 
export class SceneComponent{ 
    scene = new THREE.Scene(); 
} 
///////////////

問題顯示在行 - 從'three-js/three'導入{THREE};

這是在爲「angular2 /芯」

預先感謝相同的目錄路徑。

來源

2016-10-17 rashmi

我開始學習關於將其他庫集成到自己的項目的Angular 2細節，因此我的猜測是它必須包含在system.js config文件夾中。

我真的想告訴你的是this angular 2 + three.js implementation 給你一些關於這個問題的光。

我會張貼它作爲評論，但我沒有聲望尚未這樣做。

乾杯！

來源

2016-10-24 13:29:03

希望你現在可以發表評論@Bruno Di Guiseppe在你關聯的回購中，有一個賣家文件夾three.js文件居住。這是必需的還是有一種方法讓three.js文件作爲引用「three」的結果位於node_modules目錄中：「^ 0.80.1」，位於package.json的依賴項中？如果是這樣，那麼導入的語法是什麼？我得到「無法找到模塊'三'」。「當我嘗試從「三」進口{三};在我的Injectable服務文件裏面 –

謝謝Ben！所以，就我所瞭解的Angular 2的「左手路徑」而言，您可以創建自己的.js庫，併爲角色中的使用者打字。我需要在我的項目中使用[DeviceOrientationControl庫]（https://threejs.org/examples/js/controls/DeviceOrientationControls.js），它沒有類型定義。由於最終angular會將TS編譯爲JS，因此您可以在index.html中包含一個包含常規

你使用角度cli？

如果是這樣，不要忘了在你的typings.d文件添加引用：

declare module 'three';

https://github.com/angular/angular-cli#3rd-party-library-installation

3rd Party Library Installation 

Simply install your library via npm install lib-name --save and import it in your code. 

If the library does not include typings, you can install them using npm: 

npm install d3 --save 
npm install @types/d3 --save-dev 
If the library doesn't have typings available at @types/, you can still use it by manually adding typings for it: 

// in src/typings.d.ts 
declare module 'typeless-package'; 

// in src/app/app.component.ts 
import * as typelessPackage from 'typeless-package'; 
typelessPackage.method();

來源

2016-10-31 23:01:27

看起來第三方庫安裝文檔的鏈接不再起作用了，實際上我找不到任何有關這個的文檔了 – user2061057

它可能應該被導入這樣的：

import * as THREE from 'three';

來源

2016-11-24 14:49:41 hex

結算這個ng2-three-demo，我使用Angular Components來定義對象fo r ThreeJS。

此外，還有一個關於回購本主題的介紹。

來源

2017-01-20 14:22:35 amcdnl

對我而言您的應用程序非常有幫助，非常感謝。 – user2061057

相關問題

在Angular2中使用three.js

回答

相關問題