cách thay đổi đường dẫn thư mục dist trong angle-cli sau 'ng build'


112

Tôi muốn sử dụng angle-cli với lõi asp.net và tôi cần biết cách thay đổi đường dẫn của thư mục dist

Câu trả lời:


74

Bạn có thể cập nhật thư mục đầu ra trong .angular-cli.json:

"outDir": "./location/toYour/dist"

14
Có thể đặt index.html trong ./location/toYour/dist và các gói javascript trong một thư mục con, ví dụ ./location/toYour/dist/bundles
Naveed Ahmed

1
Có ai biết về bất kỳ cập nhật nào về việc tùy chỉnh thêm outDir không? css / ts / trong đường dẫn riêng biệt
fidev

190

Cách hiện tại hơn là cập nhật thuộc outDirtính vào .angular-cli.json.

Đối ng buildsố lệnh --output-path(hay gọi -optắt là) cũng vẫn được hỗ trợ, điều này có thể hữu ích nếu bạn muốn có nhiều giá trị, bạn có thể lưu chúng trong package.jsontập lệnh npm của mình .

Cẩn thận: Các .angular-cli.jsontài sản không được gọi output-pathnhư câu trả lời hiện đang được chấp nhận bởi @ cwill747 nói. Đó chỉ là ng buildlập luận.

Nó được gọi outDirnhư đã đề cập ở trên, và nó là một thuộc appstính.

.

PS

(Tháng 12 năm 2017)

1 năm sau khi thêm câu trả lời này , ai đó đã thêm một câu trả lời mới với thông tin về cơ bản giống nhau và Người đăng ban đầu đã thay đổi câu trả lời được chấp nhận thành câu trả lời trễ 1 năm có cùng thông tin trong dòng đầu tiên của câu trả lời này.


3
Có thể đặt index.html trong ./location/toYour/dist và các gói JavaScript trong một thư mục con, ví dụ ./location/toYour/dist/bundles
Naveed Ahmed

10
: D PS đắng
Sunil Kumar

4
tốt nhất PS Tôi đã nhìn thấy ở đây
Frenkey

anh ta có thể đang quảng cáo cho bạn của mình ở đây, đây là một vụ tham nhũng
Alexander Borovoi

69

Đối với Angular 6+, mọi thứ đã thay đổi một chút.

Xác định vị trí tạo tệp ứng dụng

Thiết lập Cli hiện đã được thực hiện trong angle.json (thay thế .angular-cli.json) trong thư mục gốc không gian làm việc của bạn. Đường dẫn đầu ra trong angle.json mặc định sẽ trông như thế này (đã loại bỏ các dòng không liên quan):

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

Rõ ràng, điều này sẽ tạo ứng dụng của bạn trong WORKSPACE / dist / my-app-name. Sửa đổi outputPath nếu bạn thích một thư mục khác.

Bạn có thể ghi đè đường dẫn đầu ra bằng cách sử dụng các đối số dòng lệnh (ví dụ: đối với các công việc CI):

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

Sa https://github.com/angular/angular-cli/wiki/build

Lưu trữ ứng dụng góc trong thư mục con

Đặt đường dẫn đầu ra, sẽ cho góc biết vị trí đặt các tệp "đã biên dịch" nhưng tuy nhiên bạn thay đổi đường dẫn đầu ra, khi chạy ứng dụng, angle sẽ vẫn cho rằng ứng dụng được lưu trữ trong gốc tài liệu của máy chủ web.

Để làm cho nó hoạt động trong một thư mục con, bạn sẽ phải đặt href cơ sở.

Trong angle.json:

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

Cli:

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

Nếu bạn không biết nơi ứng dụng sẽ được lưu trữ trong thời gian xây dựng, bạn có thể thay đổi thẻ cơ sở trong index.html đã tạo.

Đây là một ví dụ về cách chúng tôi thực hiện điều đó trong bộ chứa docker của chúng tôi:

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


17

Điều duy nhất phù hợp với tôi là thay đổi outDircả angular-cli.jsonsrc/tsconfig.json.

Tôi muốn thư mục phân phối của mình bên ngoài thư mục dự án góc cạnh. Nếu tôi cũng không thay đổi cài đặt src/tsconfig.json, Angular CLI sẽ đưa ra cảnh báo bất cứ khi nào tôi xây dựng dự án.

Đây là những dòng quan trọng nhất ...

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

Và ...

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

2
Tuyệt vời! Cập nhật cho cli 7x, ở trên được thực hiện trong angular.jsonvà trường outputPath( tsconfig điều chỉnh ở trên vẫn giữ nguyên). Hth
EdSF

17

Hãy coi chừng: Câu trả lời chính xác ở bên dưới. Điều này không còn hoạt động

Tạo một tệp được gọi .ember-clitrong dự án của bạn và đưa vào đó những nội dung sau:

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

9

Angular CLI hiện sử dụng các tệp môi trường để thực hiện việc này.

Đầu tiên, hãy thêm một environmentsphần vàoangular-cli.json

Cái gì đó như :

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

Và sau đó bên trong tệp môi trường ( environments/environment.prod.tstrong trường hợp này), thêm một cái gì đó như:

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

bây giờ khi bạn chạy:

ng build --prod

nó sẽ xuất ra ./whatever/dist/thư mục.


1
Có vẻ như câu trả lời tốt nhất, nhưng Angular CLI vẫn xuất bản các tệp của tôi trong thư mục dist-. Phiên bản:angular-cli: 1.0.0-beta.21
NinjaFart

Từ Angular CLI Wiki : outDir (string): Thư mục đầu ra cho kết quả xây dựng. Mặc định là dist /.
hbthanki

@hbthanki Đó là công tắc cli, không phải thuộc tính tệp môi trường json
swestner

9

cho các trang github mà tôi sử dụng

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

Đây là những gì sao chép đầu ra vào thư mục tài liệu: --output-path=docs


2

Một tùy chọn khác là đặt đường dẫn webroot vào thư mục cli dist góc. Trong Program.cs của bạn khi định cấu hình WebHostBuilder chỉ cần nói

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

hoặc bất cứ điều gì đường dẫn đến dir dist của bạn.

Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.