Visual Studio 2015初體驗——前端開發工做的問題

前言

由於後臺項目開發適用的VS2015，爲了跟後臺開發配合，前端部門也統一從VS2013升級到了VS2015。

由於C盤空間不足要先卸載，這裏就不說卸載2013時花了多長時間，只說安裝2015時用了將近3個小時，不過安裝的是英文版，又去下載了中文語言包，一個語言包竟然也高達2個多G，真不知道里面到底有多少東西。

總之最終裝好了，開始安裝WEB開發「套件」：WEB Essentials2015.1+ReSharper10+TypeScript1.7(自帶)+JSDOC

都搞定後發現若干問題。。。。

VS2015的前端開發問題

一、TypeScript開發沒有右側的實時編譯預覽了

我很是喜歡這個功能，能夠實時看到編譯後的代碼，既能夠保證編譯後的JS是我想要實現的代碼，也能夠順帶學習TypeScript語法與原理。可是他沒有了，我知道這個實時預覽功能是WEB Essentials插件提供的，遂去插件的選項面板，發現竟然沒有TypeScript這個子選項了，連SASS，LESS，CoffeeScript選項都沒了，只有CSS和JS還有HTML，幾乎跟徹底報廢了同樣。

去官方網站上查，原做者的答覆是：

madskristensen:

The TS preview pane has been removed from Web Essentials 2015 due to continuously running into conflicts with the TS compiler when new versions come out. The TS team are aware of it and I hope they will add the feature into the TS tooling in the future. It is possible that this feature will be included in the brand new Web Compiler extensions (https://visualstudiogallery.msdn.microsoft.com/3b329021-cd7a-4a01-86fc-714c2d05bb6c) when preview panes have been implemented.

大概意思是由於VS的bug致使WEB Essentials2015插件移除了全部編譯器，天然也就沒有了實時預覽。

好吧，沒有預覽我還能接受，至少他還能夠用，能夠工做。

原文連接：https://github.com/madskristensen/WebEssentials2015/issues/53

 

二、SASS開發沒有右側實時CSS編譯預覽

緣由同上，由於都是WEB Essentials插件提供的支持。

 

三、SASS，LESS沒法編譯

這個我就不能忍了，沒法編譯成CSS就無法工做了，不過WEB Essentials的做者提供給了一個新插件：Web Compiler。

Web Compiler

A Visual Studio extension that compiles LESS, Sass, JSX, ES6 and CoffeeScript files.

看介紹彷佛是專門爲了解決VS2015的編譯問題的插件，裝好之後，發現並不能想VS2013中那樣只要按下Ctrl+S就能夠自動編譯。

須要編譯哪一個SASS文件，再手動將其添加入他的編譯文件列表，以後才能使用Ctrl+S自動編譯。

點擊「Compile File」手動將scss文件添加到需編譯文件列表（compilerconfig.json）並指定其文件路徑：

[
  {
    "outputFile": "Style/StyleSheet1.css",
    "inputFile": "Style/StyleSheet1.scss"
  },
  {
    "outputFile": "Style/main.css",
    "inputFile": "Style/main.scss"
  }
]

 

雖然他也提供了Compile all的功能，但事實上仍是不太好用，對於新建立的SASS文件依然不能自動包括進來，仍是須要手動觸發編譯。依然沒有VS2013裏面那樣好用。

試用到這裏我已經下定決心卸載VS2015了，從新用回VS2013，等2015再發展一段時間，修復一些bug以後再用吧。

卸載VS2015時的痛苦不說了，至今還未卸載乾淨….

解決方案

即本身配置Grunt和Bower，來實現保存自動編譯。

由於項目進度吃緊，技術先日後放，遂並不打算再新增額外的工做，想了解具體的能夠參考stackoverflow上的討論。

完整解決方案：

一、http://stackoverflow.com/questions/30107925/how-to-compile-sass-files-on-save-in-visual-studio-2015

二、http://www.gibedigital.com/blog/2015/may/28/compiling-sass-in-visual-studio-2015/

 

最後

根據博友的評論，更新一段。

本文實爲一篇標題黨，發了不少牢騷，也引發了我做爲開發者的思考，但同時不能否認VS2015在前端開發的努力與進步，也增長不少對前對優化的功能，真的不少。

並且從微軟近期的一系列動做而言，都有擁抱開源之態。也改變了以前的「替你作好全部事」的一站式服務思想。

很是贊同博友@kennywangjin的觀點：

請仔細閱讀vs2015的相關文檔，不要覺得2013=》2015就是一個刷數字的遊戲。
VS2015的前端須要用到gulp或者grunt，號稱前端開發，這兩個不知道的話有點對不起本身的稱號。
說WIN10或者VS2015不行的，請仔細檢討下是否是本身的想法過於陳舊，還停留在之前的開發思路上。微軟在積極向開源領域靠攏，開發者是否是也應該要逐漸轉變思路了？
不要怪變化太快。窮則思變，變則通，通則久，以微軟現在的處境，想要東山再起，必需要進行大幅度的改革，這是陣痛，熬過了天然前途無限；開發者也應該有此準備。

這是一個你跑着都追不上變化的時代。

(完)

原文連接-http://www.cnblogs.com/xxcanghai/p/5032447.html