预期“样式"为字符串数组.角度2 [英] Expected 'styles' to be an array of strings. Angular2

问题描述

我收到这样的错误

未捕获的错误:预期样式"为字符串数组.

Uncaught Error: Expected 'styles' to be an array of strings.

这是我的代码

styleUrls:[
    "../../styles/login.component.styles.scss"
],

当我以相同的方式声明它们时，具有样式的文件与组件位于同一目录中，不会发生问题.

When I have them declared in the same way but, the file with styles exist in the same directory as the component the problem does not occur.

推荐答案

我为此提交了一个问题 ，该问题被分类为解决方法2:不明显，优先级:2(必需)，严重性3:损坏.

我在将现有的angular 2 beta-6 应用程序移植到angular-cli 1.2.6时遇到了类似的困难；我们在整个过程中都使用SCSS.

I was struggling with something similar while porting an existing angular 2 beta-6 application to angular-cli 1.2.6; we use SCSS throughout.

注意事项:我不知道我需要进行的修改(下面概述)是否是我们原有体系结构中的工件，框架的局限性或其他，但它们确实适用于我.

Caveat: I do not know if the modifications I was required to make (outlined below) are artifacts from our legacy architecture, are limitations of the framework, or are something else, but they worked for me.

经过大量调试并尝试了各种来源的建议之后，我发现某些webpack魔术会导致由 @Component 的 styleUrl [] ，它也位于 .angular-cli.json 的 styles [] 数组中，可解释为 {} .预期的输出是已编译的SCSS文件作为CSS的字符串表示形式.

After much debugging and trying recommendations from various sources, I discovered that some webpack magic causes the compiled CSS resulting from a file reference in a @Component's styleUrl[] which is also in .angular-cli.json's styles[] array to be interpreted as {}. The expected output is a string representation of the compiled SCSS file as CSS.

这将导致 angular-compiler 的 assertArrayOfStrings()调用以 throw 的方式调用，除了 Expected'"+标识符+'为字符串数组.

This will then cause angular-compiler's assertArrayOfStrings() call to throw with none other than Expected '" + identifier + "' to be an array of strings.

我必须对我的应用程序进行以下更改才能使其正常工作:

I had to make the following changes to my application to get it to work:

属于 app.component 的 styleUrls [] 数组的
1. 全局样式表引用必须移至 .angular-cli.json 的 app [0] .styles [] 数组.
2. app.component 的 styleUrls [] 数组应为空.
3. app.component 的封装:ViewEncapsulation.None 元修饰符无法删除.
在 .angular-cli.json 的 app [0] .styles [] 数组中引用的
4. 样式表不得在任何组件的 styleUrls中引用[] 装饰器.

1. Global stylesheet references that were app.component's styleUrls[] array must be moved to .angular-cli.json's app[0].styles[] array.
2. app.component's styleUrls[] array should be empty.
3. app.component's encapsulation: ViewEncapsulation.None meta-decorator can be removed.
4. Stylesheets which are referenced in .angular-cli.json's app[0].styles[] array must not be referenced in any Component's styleUrls[] decorator.

这篇关于预期“样式"为字符串数组.角度2的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！