解決Angular4項(xiàng)目部署到服務(wù)器上刷新404的問(wèn)題
剛遇到Angular4項(xiàng)目npm run build 后部署到服務(wù)器可以訪問(wèn),但是刷新頁(yè)面會(huì)出現(xiàn)404的錯(cuò)誤!在網(wǎng)上搜了一下看到有些人寫(xiě)的解決辦法還有錯(cuò)誤在里面,一眼看就知道的錯(cuò)誤,感覺(jué)這些人真的有毛病,決定寫(xiě)了博客,為什么那么不仔細(xì),寫(xiě)錯(cuò)誤的上去,禍害別人嗎!!
解決angular2頁(yè)面刷新后報(bào)404錯(cuò)誤辦法:
配置app.module.ts
import {HashLocationStrategy , LocationStrategy} from '@angular/common'; @NgModule({ declarations: [AppCmp], bootstrap: [AppCmp], imports: [BrowserModule, routes], providers: [{provide: LocationStrategy, useClass: HashLocationStrategy}] });
主要添加的代碼:
providers: [{provide: LocationStrategy, useClass: HashLocationStrategy}]
這樣設(shè)置后,訪問(wèn)angular站點(diǎn),會(huì)自動(dòng)在根節(jié)點(diǎn)后面加一個(gè)#錨點(diǎn)。再次刷新便不會(huì)報(bào)404錯(cuò)誤了。
以上這篇解決Angular4項(xiàng)目部署到服務(wù)器上刷新404的問(wèn)題就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
小談angular ng deploy的實(shí)現(xiàn)
這篇文章主要介紹了小談angular ng deploy的實(shí)現(xiàn),文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-04-04Angular2監(jiān)聽(tīng)頁(yè)面大小變化的解決方法
這篇文章主要介紹了Angular2監(jiān)聽(tīng)頁(yè)面大小變化的解決方法,需要的朋友可以參考下2017-10-10Angular實(shí)踐之將Input與Lifecycle轉(zhuǎn)換成流示例詳解
這篇文章主要為大家介紹了Angular實(shí)踐之將Input與Lifecycle轉(zhuǎn)換成流示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-02-02Angular.js中$resource高大上的數(shù)據(jù)交互詳解
這篇文章主要給大家介紹了關(guān)于Angular.js中$resource高大上的數(shù)據(jù)交互的相關(guān)資料,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家學(xué)習(xí)或者使用angular.js具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面跟著小編來(lái)一起看看吧。2017-07-07angular2中使用第三方j(luò)s庫(kù)的實(shí)例
下面小編就為大家分享一篇angular2中使用第三方j(luò)s庫(kù)的實(shí)例,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-02-02在 Angular 中使用 ViewChild 訪問(wèn)子組件、指令或 D
這篇文章主要介紹了如何在 Angular 中使用 ViewChild 來(lái)訪問(wèn)子組件、指令或 DOM 元素,在本教程中,您使用了 ViewChild 來(lái)從父組件類(lèi)中訪問(wèn)指令、子組件和 DOM 元素,需要的朋友可以參考下2024-08-08使用Angular CDK實(shí)現(xiàn)一個(gè)Service彈出Toast組件功能
本文主要寫(xiě)用cdk實(shí)現(xiàn)一個(gè)簡(jiǎn)單的Toast組件,使用的是cdk中的overlay模塊,需要手動(dòng)安裝環(huán)境,具體安裝方法及相關(guān)實(shí)現(xiàn)代碼跟隨小編一起看看吧2021-07-07Angular 4.x+Ionic3踩坑之Ionic3.x pop反向傳值詳解
這篇文章主要給大家介紹了關(guān)于Angular 4.x+Ionic3踩坑之Ionic3.x pop反向傳值的相關(guān)資料,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧。2018-03-03AngularJS 路由詳解和簡(jiǎn)單實(shí)例
本文主要介紹AngularJS 路由,這里整理了相關(guān)資料進(jìn)行詳細(xì)介紹,并附實(shí)例代碼和實(shí)現(xiàn)效果圖,有需要的小伙伴可以參考下2016-07-07