M1 MacbookのWeb開発環境

ng new my-app ちょっと時間が開いてしまいましたが、開発環境の整備をしていこうと思います。

Web開発にはプロジェクトによって色々なプログラミング言語を使ったりしていますが、ここ最近一番多い構成はAngular / node.js / TypeScript な構成です。エディタにはVisual Studio Codeを使っています。

Node.jsのインストール

v15からARM64に対応しているそうなので、v15をインストール。node.jsのバージョン管理には以前からnvmを使用しているので、まずはnvmをインストール。

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.37.2/install.sh | bash

xcodeをまだ動かしていなかったのでライセンスの確認をするようにメッセージが表示される。

You have not agreed to the Xcode license agreements, please run 'sudo xcodebuild -license' from within a Terminal window to review and agree to the Xcode license agreements.

Failed to clone nvm repo. Please report this!

エラーメッセージの通り sudo xcodebuild --license を実行してライセンスを確認して agree と入力。

もう一度 nvmのインストールスクリプトを実行。

すると今度はシェルの設定ファイルがないから、ファイルを作って再度スクリプトを実行するか、設定ファイルに追記しろってメッセージが表示される。

=> Profile not found. Tried ~/.bashrc, ~/.bash_profile, ~/.zshrc, and ~/.profile.

=> Create one of them and run this script again

=> Append the following lines to the correct file yourself:

touch ~/.zshrc を実行して再度nvmのインストールスクリプトを実行して無事にインストールできました。

開いているターミナルではパスが通っていないので、一旦ターミナルを立ち上げ直して、nvmコマンドが使えることを確認したら

nvm install v15

を実行してnodejs v15のインストールを行います。バイナリファイルがないようで、ソースコードからビルドを行うので少々時間がかかります。

Visual Studio Codeのインストール

Visual Studio Codeのリリース版ではまだARM64版は提供されていませんが、ベータ版的な位置付けのInsider BuildでARM64版が提供されているのでこちらをインストールしてみます。

https://code.visualstudio.com/insiders/

ARM64版をダウンロードしたら、zipファイルを展開してアプリケーションフォルダにコピーするだけですね。

Insider版はアイコンの色がちょっと違う

まあ、普通に使えてますね。

Angularを動かしてみる

とりあえずnodeとエディタの準備ができたので、angularを動かしてみる。

npm install -g @angular/cli ng new my-app cd my-app npm install ng serve

はい、何事も問題なく動きますね。

このブログの人気の投稿

M1 Macbookの仮想化環境 Parallels DesktopでWindows10

CPUアーキテクチャの変更でもっとも影響を受けるところからいきなりぶっこんでみようと思います。十数年前にPowerPCアーキテクチャからIntelアーキテクチャへの変更で、ユーザとしてもっとも恩恵を受けられたのがBootCampやParallelsなどの仮想マシン環境を使って、Windowsが使えるところが大きかったりします。開発作業などはMacだけで行えたとしても、動作確認を行うためにWindowsの環境が必要になったり、Mac版のMS Officeでは印刷がズレてしまったり、Windows版のソフトしか提供されていなかったりなど、手元でWindowsが動いてくれたほうが嬉しい人も多いと思います。 IntelアーキテクチャからARMアーキテクチャの変更によって、一般的に広く使われているIntelアーキテクチャ向けのWindowsは動かなくなっています。ですがMicrosoftはWindows8の頃から、ARM向けのWindowsをハードウェアベンダ向けには提供していて、これが一般に向け提供されるのかみなさん興味津々な状態です。一般向けに提供されている訳ではないですが、Microsoftのベータテスト的なプログラム Insider ProgramでWindows 10が配布されており、これを試しに動かすことができるようです。 Windows Insider Program Macの仮想化環境としてはParallels、VMWare Fusion、VirtualBoxなどが使われていると思いますが、私はParallelsを愛用しています。 Parallels DesktopのM1対応のテクニカルプレビュー版が公開されているので、これを使ってARM版Windows 10を動かしてみます。早速Parallels Desktopのテクニカルプレビュー版をダウンロードしてみます。ダウンロードした時のバージョンは16.3.0-50385 となっていました。インストール後に、こんなダイアログが表示されます。Intelベースの既存のVMを動かすことはできないし、新しくIntelベースのVMを作ることはできない的なことを書いていそう。続いてWindows 10のイメージのダウンロードを行いますが、サイズが7.6GBもあるのでかなり時間がかかります。ビルド番号は202

MacからWindowsの名前解決をする

Windowsな環境だと、NetBIOSでコンピュータ名で名前解決ができたりしてとても便利です。そんなこともあって、一時期はLinuxサーバに用がなくてもSambaをインストールしたりしていた時代もありました。ですがMacからはNetBIOS名で名前解決してくれません。Windowsとのファイル共有にはSambaが使われているので、NetBIOSで名前解決しようと思えば簡単にできるはずですが、色々あるんでしょうね。きっと。実際のところ、ファイル共有だけであればWindowsでもLinux上のSambaでも問題なくできるんですが、pingを打ちたい時や、pingを打ちたい時、ほかhttpとかデータベースに繋げたい時とかに困るんです。pingを打ちたい時の方が多いですが。とりあえず手動でなら、NetBIOS名からIPアドレスは引けたりします。おもむろにターミナルを開いて $ smbutil lookup ホスト名とすれば、IPアドレスが引けます。ので、このIPアドレスを指定してping打ったり、他色々できますが、面倒でやってられませんね。じゃあMacでNetBIOSのようなものってないのかというと、ちゃんとあって、mDNSという仕組みが使われています。 mDNSの詳しいことは後日調べるとして、LinuxならavahiをWindowsならBonjourをインストールして、ホスト名.localで名前解決ができるようになります。他、DHCPサーバとDNSサーバを連動されてあげれば、ソフトを追加でインストールしなくて済むのでスマートに仕上がりますが、最近は面倒なのでDHCPサーバはブロードバンドルータに任せっきりなのでありました。 Bonjour for Windowsのダウンロードがイマイチ良く分からないことになっています。とりあえず Bonjour Print Services for Windows をダウンロードすれば大丈夫そう。

電子マネーチャージ用のクレジットカード

MUFGカードでマイルをセコセコ貯めているのですが、昨年、 MUFGカードからの衝撃的なお知らせをお伝えしたとおり、MileagePlus MUFGカードゴールドプレステージ Visaでの電子マネーチャージしてもマイルが貯められなくなって寂しい思いをしています。マイルを1箇所にまとめてためたいところですが、コンビニでクレジットカード払いをするのもなんだな面倒な感じですし、そもそもおサイフケータイ大好きっ子なので、電子マネー使えるところでは、シャリーンとか、ピュリーンとかピピッ！とかワォンとか鳴かせたいわけです。そこで仕方がないので、電子マネーチャージ用に別のクレジットカードを作ることにしました。1.2%のPontaポイントが貯まるリクルートカードです。昨年まではリクルートポイントってのが貯まってたみたいですが、リクルートポイントがPontaポイントに統合されたみたいです。じゃらんとかホットペッパーとかよく使うので、リクルートポイントでもPontaポイントでもどちらでもいいのですが、Pontaポイントの方が購買情報などをより広くばらまかれるんでしょうね。今なら最大6000ポイントもらえるらしいですが、内4000ポイントはカードで携帯電話の料金を払った場合なので、ちょっと煩わしいです。カードの紹介に「電子マネーチャージでもポイント対象になります。」って書いているので大丈夫だと思うのですが、カードの発行元がMUFGカードなので、またそのうち衝撃的なお知らせが来ないか心配ではあります。とはいえ、年会費無料で1.2%の還元率は魅力的なので、ひとまず電子マネーチャージ用に申し込んでみました :)

ホンダログ

このブログを検索