有沒有辦法讓TypeScript在客戶端的Plunkr中傳輸？

對於我的團隊來說，我們在項目之間，但是我正在對TypeScript以及如何使用Angular 1.x進行一些基礎研究，因爲Angular 2仍在烘焙。我通常使用Plunkr來製作小規模的原型，以便在技術演示和技術過程中，我們可以看到事物是如何工作並在原地混亂的。有沒有辦法讓TypeScript在客戶端的Plunkr中傳輸？

，但問題是我試圖讓一個非常基本角的1.x + TS設置在this plunker，但已運行到得到它才能正常工作的問題。我認爲問題的一部分是客戶端的轉譯，但我相信這不是我搞亂的唯一的東西。具體...

查看代碼： '！只要做到這一點在Visual Studio'

<!DOCTYPE html> 
<html lang="en" ng-app="app"> 
    <head> 
    <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" /> 
    </head> 

    <body> 
    <div ng-controller="testController as ctrl"> 
     <h1>{{ ctrl.testMethod() }}</h1> 
    </div> 

    <!-- Scripts... --> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.js"></script> 
    <script type="text/typescript" src="app.ts"></script> 
    <script type="text/typescript" src="controllers.ts"></script> 
    <script type="text/typescript" src="registrations.ts"></script> 

    <!-- Required for web transpilation... --> 
    <script type="text/javascript" src="//niutech.github.io/typescript-compile/js/typescript.min.js"></script> 
    <script type="text/javascript" src="//niutech.github.io/typescript-compile/js/typescript.compile.js"></script> 
    </body> 
</html>

我得到了客戶端transpilation從this StackOverflow question，但這個問題的決議是兩種，或'將您的TypeScript轉碼，然後將JavaScript插入到Plunkr'中，這對我不起作用，因爲我的團隊首先考慮轉換到TypeScript - 我們需要能夠使用typescript，因此需要原型來幫助我們瞭解它是如何工作的。另外，該問題指出，轉譯部分實際上已經過時了。

問題：首先，是否有更新的客戶端TypeScript到JavaScript轉換器，我可以鏈接到我的原型plunker中？其次，有沒有更好的資源可以參考如何讓Angular 1與TypeScript一起工作？我已經非常，非常小發現運氣什麼，談論如何使角1.x的打字稿工作...

來源

2015-11-04 Andrew Gray

如果你的團隊是TS的新手，缺乏適當的開發環境只會阻礙你。這個例子支持這一點：它正在被轉移。並且在控制檯中出現一堆編譯錯誤。 – estus

編輯：原來你可以使用plnkr打字稿，這是我剛剛從學下面http://embed.plnkr.co/suu7Yg/preview

的評論對於隱式模式，這一切都需要在創建文件具有相應擴展，即script.ts或style.scss，然後與預期編譯擴展引用它的頭部，即script.js或style.css。非常酷，plnkr！

~~我相當肯定Plunker不支持打字稿（當然我可能是錯的）~~（編輯：是的，我錯了，它只是並不明顯，這是一個功能）。但是，我可以提供一個想法來解決您想要完成的任務。

嘗試將您的小規模原型和演示轉移到codepen。它們都是我一直使用的非常可比的應用程序，並且codepen目前支持打字稿，所以如果這是您需要與您一起玩的話。

它隱藏在小齒輪的背後，與外部的js文件一起包括：在打字稿

轉到：

繁榮。很高興爲您的現場演示。希望有所幫助！

來源

2015-11-04 18:59:49 wesww

Plunker支持TS http://embed.plnkr.co/suu7Yg/preview – estus

@estus - 「未找到」... –

@AndrewGray它在那裏，但意外拋出'未找到'。這裏是[另一個鏈接]（https://github.com/ggoodman/plunker-run-plugin/blob/master/README.md）。它涉及服務器端Plunker TS編譯，這不完全是你的情況，但可能也適合。與客戶端相反，它肯定需要RequireJS（不知道TS是否與SystemJS配合良好）才能導入模塊。 – estus

正如@wesww在他修正的答案中所提到的，Plunker支持服務器端編譯TypeScript。我的意思是當你的TypeScript代碼被髮送到預覽服務器時，它將被髮送未經轉換。

假設你有一個文件script.ts，寫的打字稿，但項目的index.html請求script.js，Plunker的預覽服務器將編譯在飛行文件和服務於編譯版本。

您可以通過創建一個tsconfig.json文件（與正常的CLI使用一致）來配置TypeScript編譯器的工作方式，以定義您的設置。

欲瞭解更多信息，請參閱Definitive Guide to Comiplation on Plunker。

來源

2015-11-05 21:36:41 filearts

有沒有辦法讓TypeScript在客戶端的Plunkr中傳輸？

回答

相關問題