Angular 2 CLI - 如何使用angular-cli ng build創建的/ dist文件夾文件

Question

我在構建之后生成dist文件夾，我的目錄看起來像

C:\Source\angular> ng build

剪切並通過另一個目錄中的dist文件夾

C:\ReSource\angularbuild

在將Index.html更改為

<base href="./ReSource/angularbuild/dist">

然后

C:\Source\angular> ng serve

獲取inline.bundle.js，main.bundle.js，styles.bundle.js，vendor.bundle.js，main.bundle.js 404找不到錯誤

我怎么能實現它？ 我想運行dist文件夾，它位於C:\\Source\\angular> angularbuild文件夾中

讓我知道正確的方法。

Answer 1

在構建之后，它只需要一個服務器來執行它，而不是服務你可以從你的終端安裝一個http服務器npm i -g http-server --save然后使用命令從dist文件夾執行你的項目（y ）：

http-server ./dist

或者在apache上使用Wamp或Xamp例如只復制www文件夾中dist文件夾的整個文件，然后重啟Apache服務

Answer 2

Dist文件夾不適用於ng服務

它是一個可以在沒有ng命令的情況下運行的構建

ng build :

它創建項目的構建，將所有“.ts文件”和其他文件轉換為瀏覽器可以理解的簡單js文件。

所以沒有必要在dist文件夾上運行ng serve ，

只需在dist文件夾中打開index.html文件，您的整個項目就會運行。

Answer 3

如果將webserver上的angular4項目部署到子文件夾DOCUMENT_ROOT / test，則可以按如下方式進行構建：

ng build --prod --base-href“/ test /”。

將dist / *文件復制到DOCUMENT_ROOT / test。

通過以下方式訪問應用程序： http：// myserver / test 。 這對我有用。

Answer 4

創建構建的步驟是

> ng build --prod // can be other environment

要通過angular-cli ng build命令創建的serve / dist文件夾，我們可以使用“ serve ”使用下面的命令來安裝serve

> yarn global add serve

並運行

serve dist/

你會得到網址並在任何瀏覽器上嘗試。