Mac から Windows がいなくなりましたので、もちろんVisual Studio が使えなくなりました。
ですので、Visual Studio Code を使ってみようかなって思います。
Mac の上でも ASP.NET Core アプリケーションは動きますもんね〜。
ただ、中途半端に綺麗な状態も若干嫌だったので、OSも入れ直したところからスタートしています。
Mac の OS の入れ直しは、Command + R を押しながら起動するとOS X 復元システムが起動するので、それを使ってWifiの設定、ディスクの中身を削除を行い、その後、OSの復元するようん流れなんですねー。(1時間くらい復元にかかったかも)
Visual Studio Code とは
Visual Studio は Windows PCで利用出来る統合開発アプリケーションですが、Visual Studio Code は Windows/Mac/Linux 上で利用出来るコードエディタです。
ですので、Visual Studio とは、機能が異なります。
また、Visual Studio Code は、GitHub でソースが公開されている、ソースオープンなアプリケーションです。
(参考)
https://code.visualstudio.com/
https://github.com/Microsoft/vscode
ASP.Net Core
今時点の自分の理解では、これまでは. Net Framework を使ったアプリケーションは、Windows の上でしか動けなかったのですが、それを Mac や Linux の上でも動かしていく .NetFramework のクロスプラットフォーム化が始まって、まずは、ASP.Net の範囲がそのようになってきたといったものだと思います。
ただ、どういう仕組みで動いているのとかは、まだ説明できるほど理解してないっす。。
(参考)
https://msdn.microsoft.com/ja-jp/library/dn878908(v=vs.110).aspx
https://docs.asp.net/en/latest/index.html
https://github.com/aspnet/home
インストール手順
下記のサイトの「Install ASP .NET 5 with Visual Studio Code」を参考にしました。
https://docs.asp.net/en/latest/getting-started/installing-on-mac.html
大枠の手順は以下の通りです。
- Mono のインストール
- Visual Studio Code のインストール
- ASP.NET Coreのインストール
- サンプルアプリの実行
1.Mono のインストール
以下のサイトから Mono を DL してインストールしてください。
http://www.mono-project.com/docs/getting-started/install/mac/
2.Visual Studio Code のインストール
以下のサイトから Visual Studio Code を DL します。zip形式を解凍するだけです。
https://code.visualstudio.com/Download
3.ASP .NET Coreのインストール
以下のリンクをクリックすると「DNX-1.0.0-rc1-update1.pkg」がダウンロードできます。これをインストールします。
https://go.microsoft.com/fwlink/?LinkId=703940
インストール後は、一度Macを再起動し、以下のコマンドで動作確認をします。
$ dnvm list Active Version Runtime Architecture OperatingSystem Alias ------ ------- ------- ------------ --------------- ----- * 1.0.0-rc1-update1 coreclr x64 darwin default 1.0.0-rc1-update1 mono linux/osx
4.サンプルアプリの実行
以下のサイトを参考に、Yeomanのインストールを行い、ジェネレータがはいたソースを動かしたいと思います。
https://docs.asp.net/en/latest/client-side/yeoman.html
(1).Node.js と npm のインストール
以下のサイトから DL してインストールします。
https://nodejs.org/en/
自分は、v4.2.6LTSをインストールしましたが、後述の作業中に npm のバージョンが古いと怒られてしまい、アップデートかけました。
[怒られる前]
$ npm -version 2.14.12
[怒られた後]
$ sudo npm install -g npm /usr/local/bin/npm -> /usr/local/lib/node_modules/npm/bin/npm-cli.js npm@3.6.0 /usr/local/lib/node_modules/npm $ npm -version 3.6.0
(2).yoとbowerとgruntとgulp のインストール
npm のバージョンで引っかかったのはこの手順です。バージョンを上げたらすんなりインストールできました。
$ sudo npm install -g yo bower grunt-cli gulp npm WARN deprecated lodash@1.0.2: lodash@<2.0.0 is no longer maintained. Upgrade to lodash@^3.0.0 npm WARN deprecated npmconf@2.1.2: this package has been reintegrated into npm and is now out of date with respect to npm /usr/local/bin/bower -> /usr/local/lib/node_modules/bower/bin/bower /usr/local/bin/grunt -> /usr/local/lib/node_modules/grunt-cli/bin/grunt /usr/local/bin/gulp -> /usr/local/lib/node_modules/gulp/bin/gulp.js /usr/local/bin/yo -> /usr/local/lib/node_modules/yo/lib/cli.js > yo@1.6.0 postinstall /usr/local/lib/node_modules/yo > yodoctor Yeoman Doctor Running sanity checks on your system ✔ Global configuration file is valid ✔ NODE_PATH matches the npm root ✔ Node.js version ✔ No .bowerrc file in home directory ✔ No .yo-rc.json file in home directory ✔ npm version Everything looks all right! abbrev@1.0.7 node_modules/grunt-cli/node_modules/nopt/node_modules/abbrev -> node_modules/grunt-cli/node_modules/abbrev : : (中略) : : └─┬ yosay@1.1.0 ├── ansi-regex@2.0.0 ├── minimist@1.2.0 ├── pad-component@0.0.1 ├─┬ repeating@2.0.0 │ └── is-finite@1.0.1 ├─┬ string-width@1.0.1 │ ├── code-point-at@1.0.0 │ └── is-fullwidth-code-point@1.0.0 ├── taketalk@1.0.0 └── word-wrap@1.1.0 npm ERR! Darwin 15.3.0 npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "install" "-g" "generator-aspnet" npm ERR! node v4.2.6 npm ERR! npm v3.6.0 npm ERR! path /usr/local/lib/node_modules npm ERR! code EACCES npm ERR! errno -13 npm ERR! syscall access npm ERR! Error: EACCES: permission denied, access '/usr/local/lib/node_modules' npm ERR! at Error (native) npm ERR! { [Error: EACCES: permission denied, access '/usr/local/lib/node_modules'] npm ERR! errno: -13, npm ERR! code: 'EACCES', npm ERR! syscall: 'access', npm ERR! path: '/usr/local/lib/node_modules' } npm ERR! npm ERR! Please try running this command again as root/Administrator. npm ERR! Please include the following file with any support request: npm ERR! /Users/agou/npm-debug.log
エラーは出てますが、ひとまず気にせずに作業を進めます。
次にインストールするものも、見つからないぞ的なエラーがでてるっぽいし。
(3).ASP.NET generator のインストール
npmでインストールします。
yoshitomo-no-MacBook-Air:~ agou$ sudo npm install -g generator-aspnet /usr/local/lib └─┬ generator-aspnet@0.0.92 : : (中略) : : └─┬ yosay@1.1.0 ├── ansi-regex@2.0.0 ├── minimist@1.2.0 ├── pad-component@0.0.1 ├─┬ repeating@2.0.0 │ └── is-finite@1.0.1 ├─┬ string-width@1.0.1 │ ├── code-point-at@1.0.0 │ └── is-fullwidth-code-point@1.0.0 ├── taketalk@1.0.0 └── word-wrap@1.1.0
(4).サンプルコードの作成
作業用フォルダを作成します。
mkdir C:MyYo cd C:MyYo
コードジェネレーターのyoを起動します。
yo aspnet
起動するとこんな感じになります。
_-----_ | | .--------------------------. |--(o)--| | Welcome to the | `---------´ | marvellous ASP.NET 5 | ( _´U`_ ) | generator! | /___A___ '--------------------------' | ~ | __'.___.'__ ´ ` |° ´ Y ` ? What type of application do you want to create? (Use arrow keys) ❯ Empty Application Console Application Web Application Web Application Basic [without Membership and Authorization] Web API Application Nancy ASP.NET Application Class Library Unit test project
今回は、Web Application を選択します。
選択すると、下記のような表示が出ますのでプロジェクト名を入力します。
今回は、「MyWebApp」
? What type of application do you want to create? Web API Application ? What's the name of your ASP.NET application? MyWebApp
Enterを押すと、ジェネレートが走ります。
create MyWebApp/gulpfile.js create MyWebApp/Dockerfile create MyWebApp/.bowerrc create MyWebApp/.gitignore create MyWebApp/appsettings.json : : (中略) : : create MyWebApp/wwwroot/images/Banner-02-VS.png create MyWebApp/wwwroot/js/site.js create MyWebApp/wwwroot/js/site.min.js create MyWebApp/wwwroot/web.config Your project is now created, you can use the following commands to get going cd "MyWebApp" dnu restore dnu build (optional, build will also happen when it's run) dnx web
porject.json に定義されているファイルをダウンロードするため、以下のコマンドを実行します。
$cd "MyWebApp" $dnu restore Microsoft .NET Development Utility CoreClr-x64-1.0.0-rc1-16231 GET https://api.nuget.org/v3/index.json OK https://api.nuget.org/v3/index.json 2555ms : : (中略) : : Installing System.Private.Networking.4.0.0 Installing System.ComponentModel.EventBasedAsync.4.0.10 Writing lock file /Users/agou/Desktop/MyYo/MyWebApp/project.lock.json Restore complete, 52027ms elapsed Feeds used: https://api.nuget.org/v3-flatcontainer/ Installed: 256 package(s) to /Users/agou/.dnx/packages
ローカルでWeb アプリを起動します。
$ dnx web info: Microsoft.Data.Entity.Storage.Internal.RelationalCommandBuilderFactory[1] : : (中略) : : Hosting environment: Production Now listening on: http://localhost:5000 Application started. Press Ctrl+C to shut down.
ブラウザを起動してhttp://loalhost:5000 に接続しましょう。
まとめ
見ていただいた通り、Mac でASP.NETのアプリケーションを作成し、Mac上で実行することができました。
ところで、Visual Studio Code はインストールしただけで何も使ってないじゃんって感じなのですが、今回の手順で記載してないのですが、ソースの編集を2か所やりました。
ASP.Net をご存知の方でしたら、気づいたかもしれませんが、アプリケーション名を2か所変更したくらいですが。。。
あと、dns restore をコマンドでやりましたが、これもVIsual Studio Code でやることもできるみたいです。
VIsual Studio Code は、Power Shell のテンプレートもあるみたいなので、Mac でPower Shell を書くときとかも便利そうです。(Azure Automationとかで使うPower Shell を書くときとか)
まだまだ、Mac初心者なので、利用方法に困っているところは若干ありますが、このまま使い続ければ何か見えそうな気がしてきました。
コメント