我正在尝试将我的角度应用程序部署到生产环境,该环境在 url 中具有额外的位置步骤,例如www.生产服务器.com/name-of-my-app 附加到其后。
当我通过 localhost:4200 上的 Angular cli 运行它并通过页面重定向时,我的应用程序工作得很好,例如从 localhost:4200/page1 到 localhost:4200/page2。
但是当我尝试设置基本 href 时
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"baseHref" : "/name-of-my-app/",
"outputPath": "dist",
"index": "src/index.html",
...
并像这样配置我的路线:
const routes: Routes = [
Route.withShell([
{path: '', redirectTo: '/sredstva', pathMatch: 'full'},
{path: 'sredstva', component: OsebnasredstvaComponent, data: {title: extract('Osebna sredstva')}}
])
];
/**
* Provides helper methods to create routes.
*/
export class Route {
/**
* Creates routes using the shell component and authentication.
* @param routes The routes to add.
* @return {Route} The new route using shell as the base.
*/
static withShell(routes: Routes): ngRoute {
return {
path: '',
component: ShellComponent,
children: routes,
canActivate: [AuthenticationGuard],
// Reuse ShellComponent instance when navigating between child views
data: { reuse: true }
};
}
}
应用程序仍将 localhost:4200/page1 路由到页面 localhost:4200/page2,而不是 localhost:4200/name-of-my-app/page1 和 localhost:4200/name-of-my-app/page2。这是为什么?
编辑:我想补充一点,当我检查页面时,基本 href 显示正确。但它不会显示在 URL 中。
正如这张图片所示 https://i.stack.imgur.com/dVXMF.jpg