Bagaimana mengubah port sudut dari 4200 ke yang lain

Saya ingin menggunakan 5000 bukan 4200 ..

Apa yang saya coba adalah saya telah membuat file dengan nama root ember-clidan menempatkan JSON sesuai dengan kode di bawah ini:

{
   "port": 5000
}

Tapi aplikasi saya masih berjalan di 4200, bukan 5000

Solusinya bekerja untuk saya adalah

ng serve --port 4401    

(Anda dapat mengubah 4401 ke nomor apa pun yang Anda inginkan)

Kemudian luncurkan browser -> http: // localhost: 4401 /

Pada dasarnya, saya memiliki dua Aplikasi dan dengan bantuan pendekatan di atas sekarang saya dapat menjalankan keduanya secara bersamaan di lingkungan pengembangan saya.

Anda dapat mengubah port aplikasi Anda dengan memasukkan perintah berikut,

ng lay --port 4200

Juga, untuk pengaturan permanen Anda dapat mengubah port dengan mengedit file angular-cli.json

 "defaults": {
    "serve": {
      "port": 8080
    }
  }

Tampaknya hal-hal telah berubah dalam versi CLI terbaru (saya menggunakan 6.0.1). Saya dapat mengubah port default yang digunakan ng servedengan menambahkan portopsi ke proyek saya angular.json:

{
    "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
    "projects": {
        "my-project": {
            "architect": {
                "serve": {
                    "options": {
                        "port": 4201
                    }
                }
            }
        }
    }
}

(Hanya properti yang relevan yang ditampilkan dalam contoh ini.)

Mengubah nodel_modules/angular-cli/commands/server.jsadalah ide yang buruk karena itu akan diperbarui ketika Anda menginstal versi baru angular-cli. Alih-alih, Anda harus menentukan ng serve --port 5000 di package.jsonseperti ini:

"scripts": {
    "start": "ng serve --port 5000"
}

Anda juga dapat menentukan host dengan --host 127.0.0.1

Lokasi untuk pengaturan port telah berubah beberapa kali.

Jika menggunakan Angular CLI 1

Perubahan angular-cli.json

{
  "defaults": {
    "serve": {
      "host": "0.0.0.0",
      "port": 5000 
    }
  }
}

Jika menggunakan CLI Angular terbaru

Perubahan angular.json

"projects": {
    "project-name": {
        ...
        "architect": {
            "serve": {
                "options": {
                  "host": "0.0.0.0",
                  "port": 5000
                }
            }
        }
        ...
    }
}

Tanpa mengubah file apa pun

Jalankan perintah

ng serve --host 0.0.0.0 --port 5000

Tidak ada yang memperbarui jawaban untuk CLI.Dengan Angular terbaru Angular CLI

Dengan latest versiondari angular-cli di mana angular-cli.json berganti nama menjadi angular.json, Anda dapat mengubah port dengan mengedit angular.jsonfile yang sekarang Anda tentukan port per"project"

projects": {
    "my-cool-project": {
        ... rest of project config omitted
        "architect": {
            "serve": {
                "options": {
                    "port": 4500
                }
            }
        }
    }
}

Baca lebih lanjut tentang itu here

Saya biasanya menggunakan ng setperintah untuk mengubah pengaturan Angular CLI untuk tingkat proyek.

ng set defaults.serve.port=4201

Perubahan itu mengubah Anda .angular.cli.jsondan menambahkan pengaturan port seperti yang disebutkan sebelumnya .

Setelah perubahan ini, Anda dapat menggunakan secara sederhana ng servedan itu akan menggunakan port yang disukai tanpa perlu menetapkannya setiap waktu.

Anda juga dapat memasukkan perintah di bawah ini di sudut ang Anda di mana Anda biasanya memasukkan start npm

ng serve --host "ip-address" --port "port-number"

Anda juga dapat menulis perintah ini: ng serve -p 5000

kebagian file ini

node_modules\@angular-devkit\build-angular\src\dev-server\schema.json

dan cari port

"port": {
  "type": "number",
  "description": "Port to listen on.",
  "default": 4200
},

ubah nilai default apa pun yang Anda inginkan dan mulai ulang server

• Untuk Permanen:

  Goto nodel_modules / sudut-cli / perintah / server.js Cari var defaultPort = process.env.PORT || 4200; dan ubah 4200 menjadi hal lain yang Anda inginkan.

• Untuk Menjalankan Sekarang:

  ng serve --port 4500 (Anda mengganti 4500 ke nomor apa pun yang ingin Anda gunakan sebagai porta)

Tidak disarankan untuk mengubah modul simpul karena pembaruan atau pemasangan ulang dapat menghapus perubahan itu. Jadi lebih baik untuk mengubah cli sudut

Sudut 9 di angular.json

{
    "projects": {
            "targets": {
                "serve": {
                    "options": {
                         "port": 5000
                     }
                }     
            }     
    }
}  

Anda dapat mengedit nomor port default yang dikonfigurasi dalam file serve.js.

Path akan project_direcory/node_modules/angular-cli/commands/serve.js.

Cari baris ini -> var defaultPort = process.env.PORT || 4200;
Ganti dengan baris ini ->var defaultPort = process.env.PORT || 5000;

jalankan saja ng serve --port 5000 --open

Jalankan perintah di bawah ini untuk selain 4200

ng serve --port 4500

Di angular.json:

"serve": {
          "builder": "@angular-devkit/build-angular:dev-server",
          "options": {
          "browserTarget": "projectname:build",
          "port": 5000
         }

Saya menggunakan angular-cli. Ini berhasil untuk saya.

dalam sudut 2 ++.

Untuk mengubah port, Anda dapat menjalankan perintah di bawah ini di terminal:

ng serve --host 0.0.0.0 --port 5000.

Meskipun sudah ada banyak solusi yang valid dalam jawaban di atas, berikut adalah panduan visual dan solusi spesifik untuk proyek Angular 7 (mungkin versi sebelumnya juga, tidak ada jaminan sekalipun) menggunakan Visual Studio Code. Temukan schema.json di direktori seperti yang ditunjukkan pada pohon gambar dan ubah bilangan bulat di bawah port -> default untuk perubahan port permanen di browser.

Buka angular.jsonfile,

Cari kata kunci "sajikan":

Tambahkan portkata kunci seperti yang ditunjukkan di bawah ini:

 "serve": {
     "builder": "@angular-devkit/build-angular:dev-server",
     "options": {
         "browserTarget": "my-new-angular-app:build",
         "port": 3001
     },
     ...

Kami memiliki dua cara untuk mengubah nomor port default di Angular.

Cara pertama untuk memberi perintah:

ng serve --port 2400 --open

Cara kedua adalah dengan konfigurasi di lokasi: ProjectName\node_modules\@angular-devkit\build-angular\src\dev-server\schema.json.

Buat perubahan pada schema.jsonfile.

{
 "title": "Dev Server Target",
  "description": "Dev Server target options for Build Facade.",
  "type": "object",
  "properties": {
    "browserTarget": {
      "type": "string",
      "description": "Target to serve."
    },
    "port": {
      "type": "number",
      "description": "Port to listen on.",
      "default": 2400
    },

Lari saja

ng layani --port yourport

Contoh:

ng serve --port 4401

Kode yang berfungsi untuk saya adalah sebagai berikut

ng serve --port ABCD

Sebagai contoh

ng serve --port 6300

Untuk menjalankan dan membuka di browser secara otomatis menggunakan bendera -openatau adil-o

ng serve -o --port 4200

Catatan: Port 4200 bersifat arbitrer. Ini bisa menjadi port pilihan Anda

Jika Anda ingin menggunakan variabel lingkungan NodeJS untuk mengatur nilai port server dev Angular CLI, pendekatan berikut dimungkinkan:

• buat skrip NodeJS, yang akan memiliki akses ke variabel lingkungan (katakanlah, DEV_SERVER_PORT) dan dapat dijalankan ng servedengan --portnilai parameter yang diambil dari variabel itu ( child_process mungkin teman kita di sini):

const child_process = require('child_process');
const child = child_process.exec(`ng serve --port=${process.env.DEV_SERVER_PORT}`);
child.stdout.on('data', data => console.log(data.toString()));

• perbarui package.json untuk menyediakan skrip ini berjalan melalui npm
• jangan lupa untuk mengatur DEV_SERVER_PORTvariabel lingkungan (dapat dilakukan melalui dotenv )

Berikut ini juga uraian lengkap pendekatan ini: Cara mengubah Port Server Development CLI Angular via .env .

Ini akan secara otomatis membuka jendela Anda juga

ng serve -o --port 4801