Angular6打包的那些事

CocoaChina 發布于2019-07-25 14:28 / 2345人閱讀

摘要：在看看的配置下其中可以防止刷新的問題。這樣我的可以用一個做代理，同時訪問我的兩個項目，兩個項目。他們的地址是項目博客項目寫著玩的，前端比較差以上可以說是解決了很大部分的坑了。

Angular在升級到6的時候，多了許多新的功能，比如ng命令，在從5升級到6的時候是無痛升級的，但是升級到了6之后，也有許多地方做了改變，比如Angular的設置，Angular的base-path等，通過在一臺機器上部署多個Angular的單頁應用，來說明這些問題。

angular 打包,縮小包體積命令

ng build --prod --aot
來源 
來源網站打不開了，但是找到一個不錯的博客

angular 6新的設置方式,我想在Angular新建項目的時候使用yarn而不是npm

You should update the article.
With @angular/cli version 6+ it will be
SET GLOBAL: ng config?—g cli.packageManager npm
SET LOCAL: ng config cli.packageManager npm
GET: ng config cli.packageManager
The diff is:

No more get/set commends, only?config?and get/set is inferred.

needs to prefix cli properties with?cli.?because there are other things now, from devkit…

base-path設置

這個設置(見詞知意)可以讓項目添加一個新的URL前綴，比如默認是/，你可以設置成/blog
在angular.json文件中找到projects->todo-web(項目名字)->architect->build->options下新增:

"baseHref": "/todo/",
"deployUrl": "/todo/"

項目打包上傳到服務器

我的項目在服務器上的位置: /todo/todo

我還有另一個angular的項目位置在: /blog/blog, 他們的項目結構是相同的。
在看看nginx的配置(server下)：

其中try_files可以防止Angular刷新404的問題。

這樣我的可以用一個Nginx做代理，同時訪問我的兩個web項目，兩個api項目。
他們的地址是:

[TODO項目]https://kazma233.me/life/

[博客項目, 寫著玩的，前端比較差]https://kazma233.me/blog/

以上可以說是解決了很大部分的坑了。

云服務器 GPU云服務器云服務器那些事 angular6 那些奇怪的錯誤云計算的股票有那些

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/40133.html

angular6根據environments配置文件更改開發所需要的環境

摘要：前端開發過程中，我們常常需要根據需求去運行或者打包不同環境的代碼，幸運的是，給我們提供了配置，但是的配置方式和的其他版本的配置方式是有所不同的，下面我就分別介紹在測試預生產環境下實現配置。前端開發過程中，我們常常需要根據需求去運行或者打包不同環境的代碼，幸運的是，angular給我們提供了environments配置，但是angular6.x的配置方式和angular的其他版本的配置...

seasonley 2019-08-23 15:39 評論0 收藏0
Angular6的服務和依賴注入

摘要：把組件和服務區分開，以提高模塊性和復用性。而要把這些任務委托給各種服務。它只會通過依賴注入讓你能更容易地將應用邏輯分解為服務，并讓這些服務可用于各個組件中。 Angular 把組件和服務區分開，以提高模塊性和復用性。通過把組件中和視圖有關的功能與其他類型的處理分離開，你可以讓組件類更加精簡、高效。理想情況下，組件的工作只管用戶體驗，而不用顧及其它。它應該提供用于數據綁定的屬性和...

sugarmo 2019-08-22 18:18 評論0 收藏0
angular6的響應式表單

摘要：在模塊里面引入要使用響應式表單，就要從包中導入，并把它添加到你的的數組中。導入驗證器函數響應式表單包含了一組開箱即用的常用驗證器函數。這些驗證器屬性可以和響應式表單提供的內置驗證器組合使用。 1：在AppModule模塊里面引入 ReactiveFormsModule 要使用響應式表單，就要從@angular/forms包中導入ReactiveFormsModule，并把它添加到你的N...

alogy 2019-08-29 16:54 評論0 收藏0
angular6的響應式表單

摘要：在模塊里面引入要使用響應式表單，就要從包中導入，并把它添加到你的的數組中。導入驗證器函數響應式表單包含了一組開箱即用的常用驗證器函數。這些驗證器屬性可以和響應式表單提供的內置驗證器組合使用。 1：在AppModule模塊里面引入 ReactiveFormsModule 要使用響應式表單，就要從@angular/forms包中導入ReactiveFormsModule，并把它添加到你的N...

hzc 2019-08-02 11:40 評論0 收藏0
angular6的響應式表單

摘要：在模塊里面引入要使用響應式表單，就要從包中導入，并把它添加到你的的數組中。導入驗證器函數響應式表單包含了一組開箱即用的常用驗證器函數。這些驗證器屬性可以和響應式表單提供的內置驗證器組合使用。 1：在AppModule模塊里面引入 ReactiveFormsModule 要使用響應式表單，就要從@angular/forms包中導入ReactiveFormsModule，并把它添加到你的N...

MycLambert 2019-08-23 12:16 評論0 收藏0