LoginSignup
5
4

More than 3 years have passed since last update.

Angular8のインストール方法

Last updated at Posted at 2019-05-07

Angular8のインストール

by Shuichi Ohtsu

ビデオ解説(日本語)
https://youtu.be/Y3kNNikdnXs

ビデオ解説(英語)
https://youtu.be/J8Jj-sKlS6I

Angular8のインストールには、

  1. プロジェクト単位のインストール
  2. システム全体でのインストール(-gオプションを指定)

の2通りがあります。

ここでは、システム全体でのインストールをご紹介いたします。

なお、現在Angular7バージョンなどで、開発を行っているシステムでは、このインストールを行わないでください。

現時点すなわち、2019年5月30日時点でインストールを行った場合には、Angular8の8.0.0になります。


システム全体でのインストール(-gオプションを指定)

システム全体でのアップグレードですが、まずNode.jsとnpmのバージョンを確認します。

node --versionと入力します。

npm --versionと入力します。


次にAngular8のインストールを行います。

まず、すでに開発を行っている既存のシステムで以下の作業を行わないでください。

バージョンアップにより稼働できなくなる可能性もありますので、新しいシステムあるいは、テスト用のシステムで行ってください。

まず、既存のAngular CLIがある場合にはそれを削除します。

npm uninstall -g @angular/cliと入力します。


アンインストールが終わりましたら、Angular8のインストールを行います。

npm install -g @angular/cliと入力します。

このコマンドで、Angular7がインストールされてしまう場合には、以下のように直接バージョン番号を指定します。2019年5月30日現在での最新バージョンは、8.0.0ですので、@の次にこのバージョン番号を指定します。

npm install -g @angular/cli@8.0.0と入力します。


ここでインストールされたバージョンを確認します。

ng --versionと入力します。

Angular8がインストールされていることがわかります。


次に適当なプロジェクトを作成して稼働をチェックしてみます。

コマンドラインでng new ng8testと入力します。

ng8testはプロジェクト名であり、この名前は任意です。


最初に、ルーティング機能を追加するか否かと問い合わせがありますが、ここではyとしておきます。

次に、スタイルシートの形式の問い合わせがありますが、SCSSを選択します。

するとプロジェクトの生成が始まります。

このプロセスには若干時間を要します。


プロジェクトが生成されましたら、そのプロジェクト・ディレクトリに入ります。

そして、code .と入力して、Visual Studio Codeを起動します。


次に、Control+@キーを押し、ターミナル・ウィンドウを開きます。


VS Codeが開きましたら、Package.jsonファイルを開き、バージョンを確認してみます。

バージョン8が表示されます。


ターミナル・ウィンドウで、ng s -oと入力して、ローカルサーバを起動し、ブラウザを開きます。


Angularのデフォルトのページが表示されました。

OKです。


VS Codeに戻り、Control+cでローカル・サーバを停止させます。


Angular8の稼働を確認できました。

OKです。


 

Reference

5
4
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
5
4