web-dev-qa-db-ja.com

「ng build --prod」と「ng serve --prod」をAngular 2 CLIで使用する方法、404エラーが発生する

ng buildを--prodオプションで実行しようとすると、1つのmain.jsファイルにコンパイルされ、コンソールにエラーが表示されません。

しかし、ブラウザーでアプリケーションを実行すると、依然として個々のjsファイルが検索されます。

私のmain.ts：

// default
import { provide, enableProdMode, ExceptionHandler } from '@angular/core';
import { LocationStrategy, HashLocationStrategy } from '@angular/common';
import { bootstrap } from '@angular/platform-browser-dynamic';
import { HTTP_PROVIDERS, Http } from '@angular/http';

// External
import {
  TranslateService, TranslateLoader, TranslateStaticLoader
} from 'ng2-translate/ng2-translate';
import {Angulartics2} from 'angulartics2';

// mine
import { CustomExceptionHandler } from './app/_common/CustomExceptionHandler';
import { UserService } from './app/_services/user.service';
import { MessagesService } from './app/_services/messages.service';
import { APP_ROUTER_PROVIDERS } from './app/app.routes';
import { App, environment } from './app/';

if (environment.production) {
  enableProdMode();
}

bootstrap(App, [
  APP_ROUTER_PROVIDERS,
  HTTP_PROVIDERS,
  provide(ExceptionHandler, { useClass: CustomExceptionHandler }),
  provide(LocationStrategy, { useClass: HashLocationStrategy }),
  {
    provide: TranslateLoader,
    useFactory: (http: Http) => new TranslateStaticLoader(http, '/assets/i18n', '.json'),
    deps: [Http]
  },
  Angulartics2,
  TranslateService,
  MessagesService,
  UserService
])
.then(() => {
  console.log('Angular 2 loaded');
})
.catch(err => console.error(err));

アプリケーションがブラウザで実行されると、それが探します

app/_services/messages.service.js
app/_services/user.service.js
app/app.routes.js
etc...

もちろん、jsファイルはすべて1つのmain.jsファイルに圧縮されているため、これらのリクエストはすべて404になります。どうすればこれを回避できますか？

javascriptangularproduction-environmentangular-cli
5
ganjan

製品をビルドすると、パスは、アプリのルートではなく、製品を表示しているシステムのルートに変わります。

システムのユーザールートフォルダーから、ビルドされたプロジェクトが配置されている場所への正しいパスを渡すことでビルドします。

例：

ng build -prod --base-href /tony/myproject/
10
tony