Question

在子文件夹中使用Apache服务器部署Angular 7项目

Angular CLI: 7.3.1
Node: 11.1.0
OS: darwin x64
Angular: 7.2.4
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.13.1
@angular-devkit/build-angular     0.13.1
@angular-devkit/build-optimizer   0.13.1
@angular-devkit/build-webpack     0.13.1
@angular-devkit/core              7.3.1
@angular-devkit/schematics        7.3.1
@angular/cli                      7.3.1
@ngtools/webpack                  7.3.1
@schematics/angular               7.3.1
@schematics/update                0.13.1
rxjs                              6.3.3
typescript                        3.2.4
webpack                           4.29.0

Index.html：

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Flightslogic</title>
  <base href="/">

  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
  <app-root></app-root>
</body>
</html>

App.routing：-

const routes: Routes = [
  { path: 'home', component: HomeComponent, pathMatch: 'full' },
  { path: '',  redirectTo: 'home', pathMatch: 'full' },
  { path: 'about-us', component: AboutUsComponent,  },
  { path: 'contact-us', component: ContactUsComponent,  },
  { path: 'products/fare-app', component: ProductFareAppComponent,  },
  { path: 'developer', component: ResourceDeveloperProgramComponent,  }
];

@NgModule({
  imports: [RouterModule.forRoot(routes), ],
  exports: [RouterModule]
})

首页导航：

 <ul class="navbar-nav ml-auto">
              <li class="nav-item active">
                <a class="nav-link waves-light" 
                href="#" 
               mdbWavesEffect>Home
              <span class="sr-only">(current)</span></a>
              </li>
              <li class="nav-item">
                <a class="nav-link waves-light" 
                mdbWavesEffect  href="about-us">About</a>
              </li>
    <ul>

我想使用子目录部署到apache服务器。我该如何实现。例如：http://www.example.com，子目录为subdir。因此，我想部署到http://www.example.com/subdir。我该怎么做到。

Answer 1

最后我解决了这个问题。通过重写.htaccess文件将.htaccess文件重写为

<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteBase /subdir/
  RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteRule . index.html [L]
</IfModule>

ng build --base-href = / subdir / --deploy-url = / subdir / --prod

使用带有子文件夹的Apache服务器部署Angular 7项目

1 个答案: