web-dev-qa-db-ja.com

Angular CLIをローカルにインストールする方法（-gフラグなし）

AngularとAngular-CLIを使い始めたばかりで、ドキュメントによると、$ npm install -g @angular/cli（グローバル）フラグを付けて-gをインストールする必要があることがわかりました。 。

ただし、残りのnode_modulesパッケージとともに、Angular-CLIをローカルにインストールしたいと思います。このように、プロジェクトをgitからダウンロードすると、単純に$ npm installを実行できます（すべての依存関係をpackage.jsonにインストールするため）。

$ npm initを実行して新しいプロジェクトを作成してから、$ npm i @angular/cli -Dを実行しようとしています（-Dは--save-devと同じです）。しかし、その後$ ng new project-nameを実行すると、別のnode_modulesディレクトリーを持つ新しいサブディレクトリーが作成されました。

angularangular-clinpm-installnode-modules
19
Gil Epshtain

一部のコメントが示唆しているように、システムにangular cliのローカルおよびグローバルバージョンを作成できます。

グローバルではなくローカルバージョンにアクセスできるようにするには（ローカルに別のバージョンをインストールしてからグローバルインストールを使用するようにしましょう）npm run-script ngを使用します

たとえば、npm run-script ng generate component SomeCoolComponent

同様の質問に対するgithubのこの回答を確認してください： https://github.com/angular/angular-cli/issues/5955#issuecomment-32027349

19
Jessycormier

npx npm i -g npxというパッケージを使用し、angularプロジェクトを作成する必要がある場合は、最初にこのコマンドを使用しますnpx -p @angular/cli ng new hello-world-project

そのため、たとえば、angular 4プロジェクトを作成する場合、上記のコマンドを変更して、このようなnpx -p @angular/[email protected] ng new hello-world-projectのようにangle-cliバージョン1.4.10を含め、プロジェクトのセットアップ時に完了したら、通常のng generateおよびその他のコマンドを使用して戻ることができます。

Angular-cliバージョンは、どのangularバージョンがプロジェクトに関連付けられるかを示し、angular-cli 1.4.10はangular 4つのプロジェクトを作成します

編集：

これは、どのcliがどのangularバージョンを作成するかに関するいくつかの有用なバージョン情報です。

（左側はcliバージョンを示し、右側はangularバージョンです）SO answer here をチェックしてください。他の開発者がこの謎を解こうとしているところです。

 1.0 - 1.4.x   = ^4.0.0
 1.5.x         = ^5.0.0
 1.6.x - 1.7.x = ^5.2.0
 6.x           = ^6.0.0
 7.x           = ^7.0.0

また、最新の安定バージョンを使用して特定のangularプロジェクトを作成する場合は、このnpx -p @angular/[email protected]のようなnpxコマンドを使用するだけで、最新の安定バージョンであるcliバージョン1.7.4を使用します。 angularのバージョン5。

8
Junaid

コマンドを使用したangular cliのgobalインストール後

npm i -g @angular/cli@(latest or 1)

ng new app-name

angularアプリを作成するファイルディレクトリに移動します。コマンドng new any-nameを使用して、グローバルangular cliがローカルcliバージョンのインストールを処理するangularアプリを作成します。

新しいプロジェクト用に手動でインストールするには、

npm init -y

npm install @angular/cli@(latest or 1)

（次のコマンドを使用する前にpackage.jsonを削除します）ng new app-name here ngは、ローカルcliバージョンを使用して、に基づいてangularアプリバージョン5または6または7を作成しますインストールされているローカルngバージョンの.

既存のローカルにインストールするには、コマンドnpm install @angular/cli@(latest or 1)のみを使用します。

1
Rinold

このコマンドに従ってください

npm install  @angular/cli

それは私のために働いた。

1
Basil Mohammed

システムにangularの下位バージョンまたはangularの別のバージョンをインストールする方法更新されたバージョンがグローバルにインストールされていることを確認してくださいnpm install g @ angular/cli

angular 2で作業する場合は、下位バージョンまたはグローバルにインストールされているバージョンとは異なる別のバージョンのangularプロジェクトがあるプロジェクトディレクトリに移動します。

npm install ng serve

Note: don't copy any of your node modules from your previous project if the current project you want to work on ,its version its different from formal project which you work on in the past check "@angular/cli": "version" check "@angular/cli": "version", which is located in package.json if its version 1.2.0 its angular 2, version 1.7.0 its angular 6

1
Alabi Temitope

Npmエコシステムは、ユーザーにツールをグローバルにインストールすることを要求する代わりに、プロジェクトローカルdevDependenciesとしてツールをインストールする方向にますます移行しています。これは良い習慣と見なされます。

CliをdevDependencyとしてインストールした場合、つまりpackage.jsonには次の行があります。

devDependencies": {
   "@angular/cli": "X.X.X",

プロジェクト内でnpxを実行するだけです。

npx ng version

これはnode_modules/.bin/フォルダー内でngリンクを検索しますが、実際には../@angular/cli/bin/ngを指します

0
Carlos Barcelona

angularをローカルにインストールするには、次の手順に従います-angular 8をグローバルにインストールし、angular 6をローカルにインストールする必要があります-「angular6」という名前のフォルダーを作成します。 Cドライブで、その中に「ng6-test-project」という名前のangular 6プロジェクトを作成します。

ターミナルで次のコマンドを入力します-

    c:\> md angular6
    c:\> cd angular6
    c:\angular6> md ng6-test-project
    c:\angular6> cd ng6-test-project
    c:\angular6\ng6-test-project> npm install @angular/[email protected]
    c:\angular6\ng6-test-project> cd..
    c:\angular6> npx -p @angular/[email protected] ng new ng6-test-project
    c:\angular6> cd ng6-test-project
    c:\angular6\ng6-test-project> npx ng --version
    c:\angular6\ng6-test-project> npm audit fix
    c:\angular6\ng6-test-project> npx ng serve --port 4201

rxjxなどのパッケージおよびバージョンでエラーが発生した場合、package.jsonを開き、「rxjs」を見つけます：「〜6.4.0」、「rxjs」に変更します：「6.0.0」、保存します。次に、ターミナルで次を入力してrxjsを更新します-

    c:\angular6\ng6-test-project> npm install

パッケージ内の警告を修正するには、次を実行します-

    c:\angular6\ng6-test-project> npm audit fix

次を入力して、angularバージョンをローカルで確認します

    c:\angular6\ng6-test-project> npx ng --version

これにより、新しいangularバージョンがローカルに保存されます

新しいポートでプロジェクトを実行するには-次を入力します-

    c:\angular6\ng6-test-project> npx ng serve --port 4201
0
Koustav