前言

因为后台项目开发适用的VS2015,为了跟后台开发配合,前端部门也统一从VS2013升级到了VS2015。

因为C盘空间不足要先卸载,这里就不说卸载2013时花了多长时间,只说安装2015时用了将近3个小时,不过安装的是英文版,又去下载了中文语言包,一个语言包居然也高达2个多G,真不知道里面到底有多少东西。

总之最终装好了,开始安装WEB开发“套件”:WEB Essentials2015.1+ReSharper10+TypeScript1.7(自带)+JSDOC

都搞定后发现若干问题。。。。

VS2015的前端开发问题

1、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

2、SASS开发没有右侧实时CSS编译预览

原因同上,因为都是WEB Essentials插件提供的支持。

3、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上的讨论。

完整解决方案:

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

2、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

Visual Studio 2015初体验——前端开发工作的问题的更多相关文章

  1. Visual Studio 2015 初体验

    据微软介绍每次发布的新版本,都承载着为开发者提供最高效的Visual Studio开发体验的使命.Visual Studio 2015亦延续了这一趋势,为开发者带来了进一步的生产力创新,包括调试和诊断 ...

  2. Visual Studio 2015 未响应/已停止工作的问题解决

    在我把之前项目从10版本升级到15版本的时候,一打开转换的项目过几分钟立马卡死,出现未响应/已停止工作的问题,我试过了很多方法: 1.升级操作系统,8.1升级10,没用! 2.重装VS,没用! 3.卸 ...

  3. Visual Studio 2015 移动跨平台开发初体验

    微软换了新 CEO 后变化很大,对我们团队最有利的消息就是 Visual Studio 2015 支持移动应用跨平台开发. 还记不记得很早之前,Xamarin 宣布与微软成为合作伙伴的消息.显然,Xa ...

  4. Visual Studio 2015 和 Apache Cordova 跨平台开发入门(一)

    基于 Windows 10 的 Visual Studio 2015 跨平台的应用开发主要分为基于Visual Studio 安装 Xamarin 扩展的跨Android.iOS 和 Windows的 ...

  5. Visual Studio 2015 开发MVC4出现错误

    在Visual Studio 2015(以下简称VS2015)中开发MVC4项目时,编译报错"当前上下文中不存在ViewBag",一直无法编译,这个是否是VS2015的Bug? 本 ...

  6. Visual Studio 2015 和 Apache Cordova 跨平台开发入门

    原文:Visual Studio 2015 和 Apache Cordova 跨平台开发入门(一) 基于 Windows 10 的 Visual Studio 2015 跨平台的应用开发主要分为基于V ...

  7. Visual Studio 2015官方汇总包括下载和视频

     7月20日 23:30 Visual Studio 2015正式版正式发布,作为微软新一代开发利器,在全地球乃至全宇宙乃至全太阳系中最强大 且没有之一的IDE(上述描述来自微博用户评论)跨平台支持成 ...

  8. 如何正确并完全安装Visual Studio 2015企业版本?

    http://blog.csdn.net/code_godfather/article/details/47381631  [简介] 常用网名: 猪头三 出生日期: 1981.XX.XX 个人网站: ...

  9. Visual Studio 2015 前端开发工作流

    Visual Studio 2015 CTP 5,全称为 Visual Studio 2015 Community Technology Preview 5,意为社区技术预览版,之前的版本为:Visu ...

随机推荐

  1. MongoDB学习——基础入门

    MongoDB--基础入门 MongoDB是目前比较流行的一种非关系型数据库(NoSql),他的优势这里不废话,我们关注怎么使用它. 安装 下载,首先肯定要去下载,我们去官网下载,在国内,可能没FQ可 ...

  2. hibernate.xml文件详解

    <!--标准的XML文件的起始行,version='1.0'表明XML的版本,encoding='gb2312'表明XML文件的编码方式--> <?xml version='1.0' ...

  3. 大数据挖掘: FPGrowth初识--进行商品关联规则挖掘

    @(hadoop)[Spark, MLlib, 数据挖掘, 关联规则, 算法] [TOC] 〇.简介 经典的关联规则挖掘算法包括Apriori算法和FP-growth算法.Apriori算法多次扫描交 ...

  4. make

    make会自动搜索当前目录下的makefile或Makefile文件进行编译,也可以通过-f选项读取其他文件. make [-abvijm etc] -C dir表示到dir指定的路径去搜索文件 -f ...

  5. wc

    $wc [-lwc] filename统计的文件的信息,缺省参数会按照lwc的顺序输出全部三种信息 -l统计文件的行数 -w统计文件的字数,字以空格和换行符分隔 -c统计文件的字符数,包括换行等 例子 ...

  6. linux批量删除进程

    在虚拟机用脚本跑了几十个client程序用来测试服务器,然后发现参数设置错误,得重来,就傻眼了,不知道怎么关这么多client进程,总不能一个一个关.还好,学习一下,想出了以下的命令.   ps -e ...

  7. jQuery 3.0 的变化

    时隔 3 个月,jQuery 团队终于发布了 3.0 Alpha 版本.有两个版本 jQuery compat 3.0 和 jQuery 3.0. jQuery compat 3.0 对应之前的 1. ...

  8. /usr/include/sys/types.h:62: error: conflicting types for ‘dev_t’

    /usr/include/sys/types.h:62: error: conflicting types for ‘dev_t’/usr/include/linux/types.h:13: erro ...

  9. git忽略某些文件

    通常项目中编译过程产生的文件或者编译器生成的临时备份文件,不需要通过Git系统去追逐(track). 在项目顶层工作目录中添加一个叫".gitignore"的文件,来告诉Git系统 ...

  10. [转]C#网络编程(异步传输字符串) - Part.3

    本文转自:http://www.tracefact.net/CSharp-Programming/Network-Programming-Part3.aspx 这篇文章我们将前进一大步,使用异步的方式 ...