2016-11-06 28 views
0

我正在使用ASP.Net Core,Angular2和Typescript,並使用來自Angular2團隊here的教程與webpack連接在一起。這一切似乎工作,但現在我需要建立每次我改變一個文件。如何使用webpack進行開發Angular2/typescript無需每次運行構建?

原始教程使用system.js,當然加載大量文件,但我只是使用靜態文件中間件,並且不需要構建開發。這非常方便,但我無法弄清楚如何對webpack進行相同操作。看起來webpack只能將所有東西捆綁在一起,而沒有單獨加載所有東西的選項,所以我需要每次運行構建。

是否有可能做一些事情,以便webpack以某種簡單的方式「擴展」軟件包?

P.S.我不想使用webpack dev服務器和一些保存等自動構建,因爲複雜性是相當高的。所以理想的解決方案是我有捆綁生產,但直接代碼加載開發,就像過去的標準mvc捆綁一樣。

回答

1

真的,最好的方法是使用webpack dev服務器。這確實沒有參與太多的設置,只是在運行,而不是一個的WebPack不同的命令:

npm install webpack-dev-server 
webpack-dev-server webpack.config.js 

然後你只要點腳本來源http://localhost:8080/webpack-dev-server/your-bundle-name.js" in your application`標籤。

這是迄今爲止最好的選擇,因爲您可以立即進行增量重新編譯和實時重新加載。

雖然我強烈建議您使用webpack-dev-server你也可以只使用普通的WebPack手錶模式:

webpack ---watch 

有沒有辦法「擴大了包」(和真的沒有必要)。例如,在所有可能的情況下,您使用webapack不僅僅是捆綁銷售,所以如果您更改打印稿文件,仍然需要重新構建。在手錶模式下的Webpack開發服務器或webpack可以進行非常快速的增量編譯,大多數人只會在開發時讓它們運行。

+0

如果我更改打字稿文件,VS會自動重新編譯它,所以這根本不是問題。但是,如果我在同一個項目中使用WebApi,那麼運行webpack dev是不夠的,我需要運行另一臺服務器,再加上以某種方式重新路由所有的url,這是我想避免的一點點痛苦:)謝謝對於輸入而言毫無疑問,也許根本沒有辦法做到我想要的。 –

+0

Webpack開發服務器總是作爲一個單獨的服務器運行,只提供webpack的東西。我使用的是aspnet mvc和webapi,我們只是爲我們的主index.html提供了一個模板,可以從dev的webpack url中加載這個bundle。 – dtabuenc

+0

在任何情況下,標準webpack中的「watch」模式應該可以工作,你只是沒有得到live-reload,並且它稍微慢一些,因爲它不從RAM – dtabuenc

相關問題