web-dev-qa-db-ja.com

'ng build'の後にangle-cliのdist-folderパスを変更する方法

私はasp.netコアで角度クリップを使用したいのですが、私はdistのパスを変更する方法を知る必要がありますフォルダ

90
cuppy

.angular-cli.jsonで出力フォルダーを更新できます。

"outDir": "./location/toYour/dist"
46
shaun bradridge

もっと最近の方法は.angular-cli.jsonoutDirプロパティを更新することです。

ng buildコマンド引数--output-path(または略して-op)もまだサポートされています。これは複数の値が必要な場合に便利です。それらをnpmスクリプトとしてpackage.jsonに保存できます。

注意: .angular-cli.jsonプロパティは、 現在@ cwill747による承認済みの回答 のようにoutput-pathと呼ばれることはありません。それがng build引数だけです。

上記のようにoutDirと呼ばれ、appsプロパティの下にあります。

P.S.

(2017年12月)

この回答を追加してから1年後 、誰かが基本的に同じ情報を含む新しい回答を追加し、元のポスターがこの回答の最初の行に同じ情報を含む1年後の回答に変更しました。

162
Meligy

Angular 6+では、状況が少し変わりました。

Ng buildがアプリファイルを生成する場所を定義します

Cliのセットアップは、ワークスペースのルートディレクトリのangular.json(.angular-cli.jsonに置き換えられます)で行われます。デフォルトのangular.jsonの出力パスは次のようになります(無関係な行は削除されました)。

{
  "projects": {
    "my-app-name": {
    "architect": {
      "options": {
         "outputPath": "dist/my-app-name",

明らかに、これはあなたのアプリをWORKSPACE/dist/my-app-nameに生成します。他のディレクトリを使用する場合は、outputPathを修正してください。

コマンドライン引数を使用して出力パスを上書きすることができます(CIジョブなど)。

ng build -op dist/example
ng build --output-path=dist/example

S.a. https://github.com/angular/angular-cli/wiki/build

サブディレクトリでのAngularアプリのホスティング

出力パスを設定すると、「コンパイルされた」ファイルを配置する場所がangleになりますが、出力パスを変更すると、アプリの実行時に、angleはアプリがWebサーバーのドキュメントルートでホストされていると見なします。

サブディレクトリで機能させるには、ベースのhrefを設定する必要があります。

Angular.jsonの場合:

{
  "projects": {
    "my-app-name": {
    "architect": {
      "options": {
         "baseHref": "/my-folder/",

Cli:

ng build --base-href=/my-folder/

アプリがビルド時にホストされる場所がわからない場合は、生成されたindex.htmlのベースタグを変更できます。

これが、dockerコンテナでこれを行う方法の例です。

entrypoint.sh

if [ -n "${BASE_PATH}" ]
then
  files=( $(find . -name "index.html") )
  cp -n "${files[0]}" "${files[0]}.org"
  cp "${files[0]}.org" "${files[0]}"
  sed -i "s*<base href=\"/\">*<base href=\"${BASE_PATH}\">*g" "${files[0]}"
fi
44

次のようにCLIも使用できます。

ng build -prod --output-path=production

# or

ng serve --output-path=devroot
44
Marian Zburlea

私にとってうまくいった唯一のことはangular-cli.jsonsrc/tsconfig.jsonの両方でoutDirを変更することでした。

私はdist-folderをAngular Projectフォルダの外に置きたかった。 src/tsconfig.jsonの設定も変更しなかった場合、プロジェクトをビルドするたびにAngular CLIが警告をスローします。

これが最も重要な行です...

// angular-cli.json
{
  ...
  "apps": [
    {
      "outDir": "../dist",
      ...
    }
  ],
  ...
}

そして….

// tsconfig.json
{
  "compilerOptions": {
    "outDir": "../../dist/out-tsc",
    ...
  }
}
17
NinjaFart

注意してください。正しい答えは以下のとおりです。これはもはや機能しません

プロジェクトに.ember-cliというファイルを作成し、その中に次の内容を含めます。

{
   "output-path": "./location/to/your/dist/"
}
16
cwill747

Angular CLIは現在これを行うために環境ファイルを使用します。

まず、environmentsセクションをangular-cli.jsonに追加します。

何かのようなもの :

{
  "apps": [{
      "environments": {
        "prod": "environments/environment.prod.ts"
      }
    }]
}

そして、環境ファイル(この場合はenvironments/environment.prod.ts)の中に、以下のように追加します。

export const environment = {
  production: true,
  "output-path": "./whatever/dist/"
};

今すぐ実行すると:

ng build --prod

./whatever/dist/フォルダに出力されます。

7
swestner

もう1つのオプションは、WebルートのパスをAngular Cli distフォルダに設定することです。あなたのProgram.csでWebHostBuilderを設定するときにちょうど言う

.UseWebRoot(Directory.GetCurrentDirectory() + "\\Frontend\\dist")

またはあなたのdist dirへの道が何であれ。

1

githubページ用

ng build --prod --base-href "https://<username>.github.io/<RepoName>/" --output-path=docs

これが出力をdocsフォルダーにコピーするものです。--output-path=docs

0
unos baghaii