創建項目之前需要先安裝angular cli,(angular是用typescript編寫的,所以先安裝typescript,再安裝angularjs-cli)。打開命令窗口輸入 npm install -g angular-cli ,等待安裝完成,就可以打開webStorm創建項目了。
1.首先需要創建一個project。
可以看到圖片上有兩個關於Angular的選擇。一個是AngularJS,這個創建的是基於Angular1.0版本類的project。另一個Angular CLI創建的才是基於Angular2.0的項目。
WebStorm有這點的好處就是會自動鏈接到你電腦里已經安裝的路徑上。從圖片可以看出:Node interpreter:就是鏈接到我電腦里面安裝node的路徑下。
location路徑是你創建項目保存的地址,可以自己隨意定義,路徑選好之后點擊Create,然后webstrom就會開始自動安裝依賴,這可能會需要一會兒,等待安裝完成會看到項目結構如下圖:
就這樣我們就創建成功了。
webStorm 可以幫我們將ts自動轉為js .會在上方提示你需不需要將ts轉為js文件,點擊ok就可以了。
項目創建好了,怎么運行呢?運行項目這邊有個步驟,就是得先開啟服務。
找到你的package.json文件鼠標右擊,找到show npm Scripts,就會看到下面有一個類似圖片這樣的樹結構
雙擊start服務器就運行起來了,這時你會看到控制台如下圖:
可以看到Server is running on http://localhost:4200
這樣我們在瀏覽器運行http://localhost:4200 就可以看到我們運行的項目啦