使用單獨編譯的單個TypeScript文件構建Angular 2項目

Question

我目前正在Angular 2中創建Chrome擴展。該應用程序有一個background.js文件，其中包含與將運行的長時間運行的進程相關的功能擴展程序運行時的背景。此文件（background.js）目前與Angular 2項目完全分離，並且在構建時作爲資產進行處理（並複製）。此設置工作，但我真的想在我的背景文件中使用TypeScript。

在這個打字稿文件其實我是想訪問某些文件從我的角度2項目作爲這樣的：

///<reference path="app/app.settings.ts"/> 

我只需要設置（常量）和業務對象（類），沒有什麼更復雜。

要實際使用此項目作爲擴展，我需要構建Angular 2項目並將背景TypeScript文件編譯爲位於同一位置的單獨JavaScript文件。

我的嘗試：

1. 配置的角度構建單獨編制的背景文件

我與我的角cli.json發揮各地文件來實現與單個理想的效果「ng build」命令。我試過包括和文件選項，沒有運氣。

使用構建的角度的應用程序和編譯的.ts文件相同的目錄

這一個實際上有希望的腳本。我有以下腳本，需要一個參數（輸出路徑）：

#!/bin/bash 
ng build --output-path=$1 
tsc --outDir $1 src/background.ts 

腳本作品，角項目建成後，background.ts文件與參考依賴一起編譯，這些都是可用所需的位置。但是生成的JavaScript不工作，我得到以下錯誤，例如：

Uncaught ReferenceError: exports is not defined 
Uncaught SyntaxError: Unexpected token import 

正如我現在明白了，我將不得不使用的WebPack真正使這項工作，但我沒有找到一個方法要從命令行執行此操作，與我的Angular項目分開執行。

Answer 1

所以，我設法解決這個問題，我會在這裏留下答案，也許它會幫助別人。

我的解決方案是使用browserify來生成一個在瀏覽器中工作的.js。首先它需要全球的裝機量：

npm install -g browserify 

張貼在討論的腳本必須進行修改，以這樣的事：

#!/bin/bash 
ng build --output-path=$1 
tsc --outDir $1 src/background.ts 
browserify $1\\background.js -o $1\\background-browserified.js 

這樣運行一個命令建立我的角2的項目和編譯並將單獨的Typescript文件複製到相同的位置。

我確定像Webpack這樣的其他模塊捆綁軟件也可以使用，但對於這樣的簡單案例，瀏覽器是我能找到的最合適的。