标签: web-essentials

刚刚从Visual Studio市场安装了Web Essentials 2017，但是似乎缺少从C＃类创建TypeScript定义的功能。在Web Essentials 2015中，我将鼠标悬停在C＃类文件上，然后会有一个选项“创建TypeScript Intellisense文件”。

我检查了项目更改日志，它显示TypeScript定义文件生成器是在1.2中实现的，安装的版本是1.5.8。

https://github.com/madskristensen/WebEssentials2017/blob/master/CHANGELOG.md

我错过了什么？

有2个文件,我想将变量样式表导入第二个文件,但在第一种情况下,我在预览模式下得到不正确的语法错误,在第二种情况下,我得到未声明的变量错误.无论如何两个案例编译正确.

预览模式错误的第一种情况:

variables.less:

@color-background: rgb(0, 0 , 0);

style1.less:

@import 'variables.less';
div
{
    color:@color-background;
} 

第二种情况,未声明的变量错误:

variables.less:

html{color:red;}
@color-background: rgb(0, 0 , 0);

style1.less:

html{color:red;}
@import 'variables.less';
div
{
    color:@color-background;
} 

html{color:red}只是修复了预览模式.它可以是任何有效的HTML.

问题是我只能用html标签启动文件以获取预览模式,但不能注释或导入指令.

我有 Visual Studio 2013 express for web 和 web Essentials 2013。我正在使用 SASS (bootstrap 3)

我注意到每当我编辑像 _table.scss 这样的部分文件时，我都会得到一个未声明变量的错误列表。

当我需要编译文件时，这会成为一个问题。

当我使用 ruby​​ 编译器使用 sublime 时，我没有任何问题。

当我放置@import“变量”时，错误消失；部分文件。

我是 VS2013 的新手，我不确定我是否遗漏了什么。

我使用的是Visual Studio 2015，而浏览器链接不适用于Firefox。IE和Chrome与Browser Link完美配合。

刚买了一台新机器，但这也无济于事。

我尝试了在browserlink仪表板中提到的先决条件（对于静态文件，请启用调试），并且我使用IIS Express，因此存在.NET 4.0。

Firefox还需要其他设置吗？

在网络视图中，我只是没有收到服务器的响应，传输了0个字节。

网络跟踪：

我正在学习第一次使用CSS预处理器(LESS),并且在该父类是变量名时尝试定义继承类的类时遇到问题.

这基本上就是我想做的事情:

@import "font-awesome/font-awesome.less"

.icon-application-home{
    .fa .fa-home;
}

但是因为fa在Font Awesome中被定义为:

@fa-css-prefix:       fa;

那么少就不会编译,因为它不能识别.fa.所以我尝试了这个:

@import "font-awesome/font-awesome.less"

.icon-application-home{
    .@{fa-css-prefix} .@{fa-css-prefix}-home;
}

然而,这也不起作用.有没有解决方法？我能在这做什么？

编辑

我在这里找到了半个答案:

导入后,我的.less文件中缺少Font-Awesome.less变量

如果我执行以下操作,则(部分)有效:

@import (less) "../font-awesome.css";

.icon-home {
    .fa;
}

但是,我注意到它.fa-home不存在......只是.fa-home:before......所以我试过这个:

@import (less) "../font-awesome.css";

.icon-home {
    .fa;
    .fa-home:before;
}

和

@import (less) "../font-awesome.css";

    .icon-home {
        .fa;
    }
    .icon-home:before {
        .fa-home:before;
    }

这些都不起作用.有任何想法吗？

我在Visual Studio中设置了"启用浏览器链接菜单"以假设Web Essentials选项,但是,我仍然在Chrome控制台中看到此错误消息.

[09:21:58 GMT+1000 (AUS Eastern Standard Time)] Browser Link: Exception thrown when trying to invoke Browser Link extension callback "madskristensen.editorextensions.browserlink.unusedcss.unusedcssextensionfactory.GetIgnoreList":
System.Reflection.TargetInvocationException: Exception has been thrown by the target of an invocation. ---> System.NullReferenceException: Object reference not set to an instance of an object.
   at MadsKristensen.EditorExtensions.BrowserLink.UnusedCss.UnusedCssExtension.GetIgnoreList()
   --- End of inner exception stack trace ---
   at System.RuntimeMethodHandle.InvokeMethod(Object target, Object[] arguments, Signature sig, Boolean constructor)
   at System.Reflection.RuntimeMethodInfo.UnsafeInvokeInternal(Object obj, Object[] parameters, Object[] arguments)
   at System.Reflection.RuntimeMethodInfo.Invoke(Object obj, BindingFlags invokeAttr, Binder binder, Object[] parameters, …

我们在styles.less中有以下声明:

.table tbody > tr > td {
    &.colnum, &.colnumdec {
            > input[type=text], > input[type=number] {
                text-align: center;
            }
        }
    }

.inputquantity {
    .colnumdec;
    width: 50px;
}

.inputprize {
    .colnumdec;
    width: 70px;
}

问题是LESS在inputprize {.colnumdec; 与未申报的mixin.

我们尝试通过添加这些clases的显式声明来解决它:

.colnum, .colnumdec {
}

但是没有属性会使LESS编译器省略它们,如果我们改为放置一个不相关的属性它可以正常工作:

.colnum, .colnumdec {
    border:inherit;
}

什么是解决这个问题的正确方法？