当样式是一个数组时，如何解决“错误:期望‘style’是一个字符串数组”？
当样式是一个数组时，如何解决“错误:期望‘style’是一个字符串数组”？
提问于 2019-08-31 03:57:55
我正在从NativeScript 3.4.2升级到6.0.3的过程中，我已经迁移了项目并升级了插件。现在，每次aI尝试运行应用程序时，它都会抛出这个错误:期望'styles‘是一个字符串数组。
我搜索了所有的文件，以确保它们都是数组。当我试图解决这个问题时，我看到人们说webpack.config.js可能是问题所在，我尝试了几种不同的方法来写下以下内容：
test: /[\/|\\]app\.css$/,
use: [
"nativescript-dev-webpack/style-hot-loader",
{ loader: "css-loader", options: { url: false } }
]
},
{
test: /[\/|\\]app\.scss$/,
use: [
"nativescript-dev-webpack/style-hot-loader",
{ loader: "sass-loader", options: { url: false } },
"sass-loader"
]
},但是我没有和运气.
错误：
System.err: Error: Expected 'styles' to be an array of strings.
System.err: StackTrace:
System.err: java.lang.RuntimeException: Unable to start activity ComponentInfo{com.smartmedreminder.patientapp/com.tns.NativeScriptActivity}: com.tns.NativeScriptException: Calling js method onCreate failed
System.err: Error: Expected 'styles' to be an array of strings.
System.err: at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2434)
System.err: at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:2494)
System.err: at android.app.ActivityThread.access$900(ActivityThread.java:157)
System.err: at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1356)
System.err: at android.os.Handler.dispatchMessage(Handler.java:102)
System.err: at android.os.Looper.loop(Looper.java:148)
System.err: at android.app.ActivityThread.main(ActivityThread.java:5527)
System.err: at java.lang.reflect.Method.invoke(Native Method)
System.err: at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:730)
System.err: at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:620)
System.err: Caused by: com.tns.NativeScriptException: Calling js method onCreate failed
System.err: Error: Expected 'styles' to be an array of strings.
System.err: at com.tns.Runtime.callJSMethodNative(Native Method)
System.err: at com.tns.Runtime.dispatchCallJSMethodNative(Runtime.java:1242)
System.err: at com.tns.Runtime.callJSMethodImpl(Runtime.java:1122)
System.err: at com.tns.Runtime.callJSMethod(Runtime.java:1109)
System.err: at com.tns.Runtime.callJSMethod(Runtime.java:1089)
System.err: at com.tns.Runtime.callJSMethod(Runtime.java:1081)
System.err: at com.tns.NativeScriptActivity.onCreate(NativeScriptActivity.java:19)
System.err: at android.app.Activity.performCreate(Activity.java:6272)
System.err: at android.app.Instrumentation.callActivityOnCreate(Instrumentation.java:1108)
System.err: at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2387)
System.err: ... 9 more
JS: CRASHEDwebpack.config.js：
module: {
rules: [
{
{
test: /[\/|\\]app\.css$/,
use: [
"nativescript-dev-webpack/style-hot-loader",
{ loader: "css-loader", options: { url: false } }
]
},
{
test: /[\/|\\]app\.scss$/,
use: [
"nativescript-dev-webpack/style-hot-loader",
{ loader: "sass-loader", options: { url: false } },
"sass-loader"
]
},
// Angular components reference css files and their imports using raw-loader
{ test: /\.css$/, exclude: /[\/|\\]app\.css$/, use: ["raw-loader", "css-loader"] },
{ test: /\.scss$/, exclude: /[\/|\\]app\.scss$/, use: ["raw-loader", "resolve-url-loader", "sass-loader"] },
{
}package.json
{
"description": "NativeScript Application",
"license": "SEE LICENSE IN <your-license-filename>",
"readme": "NativeScript Application",
"repository": {
"type": "git",
"url": "..."
},
"nativescript": {
"id": "...",
"tns-android": {
"version": "6.0.2"
},
"tns-ios": {
"version": "6.0.2"
}
},
"dependencies": {
"@angular/animations": "~8.2.0",
"@angular/common": "~8.2.0",
"@angular/compiler": "~8.2.0",
"@angular/core": "~8.2.0",
"@angular/forms": "~8.2.0",
"@angular/http": "8.0.0-beta.10",
"@angular/platform-browser": "~8.2.0",
"@angular/platform-browser-dynamic": "~8.2.0",
"@angular/router": "~8.2.0",
"@nstudio/nativescript-cardview": "^1.0.0",
"@nstudio/nativescript-pulltorefresh": "^1.0.1",
"CUSTOM": "CUSTOM",
"moment": "^2.24.0",
"nativescript-angular": "^8.2.0",
"nativescript-bluetooth": "^1.3.0",
"nativescript-CUSTOM": "CUSTOM",
"nativescript-CUSTOM": "CUSTOM",
"nativescript-feedback": "CUSTOM",
"nativescript-fingerprint-auth": "^7.0.1",
"nativescript-gradient": "2.0.1",
"nativescript-https": "CUSTOM",
"nativescript-iqkeyboardmanager": "1.5.1",
"nativescript-local-notifications": "^4.0.1",
"nativescript-localstorage": "2.0.1",
"nativescript-modal-datetimepicker": "1.2.0",
"nativescript-orientation": "2.2.3",
"nativescript-permissions": "1.3.7",
"nativescript-secure-storage": "2.5.0",
"nativescript-theme-core": "2.0.6",
"nativescript-ui-sidedrawer": "^7.0.0",
"nativescript-vibrate": "2.1.3",
"reflect-metadata": "~0.1.13",
"rxjs": "^6.5.2",
"tns-core-modules": "^6.0.7",
"uint48be": "^2.0.1",
"zone.js": "^0.9.1"
},
"devDependencies": {
"@angular/compiler-cli": "~8.2.0",
"@ngtools/webpack": "~8.2.0",
"babel-traverse": "6.26.0",
"babel-types": "6.26.0",
"babylon": "6.18.0",
"lazy": "1.0.11",
"mini-css-extract-plugin": "^0.8.0",
"nativescript-dev-webpack": "^1.1.1",
"raw-loader": "^3.1.0",
"tns-platform-declarations": "6.0.1",
"tslint": "5.19.0",
"typescript": "~3.5.3",
"uglifyjs-webpack-plugin": "~2.2.0"
}
}回答 1
Stack Overflow用户
发布于 2019-11-13 06:12:04
在我的例子中，我能够通过从app.component中的stylesUrl中删除app.css来解决这个问题。
app.component.ts：
import { Component } from "@angular/core";
import { setStatusBarColors } from "./shared";
@Component({
selector: "main",
template: "<page-router-outlet></page-router-outlet>",
// styleUrls: "[./app.css]" **I removed this line**
})
export class AppComponent {
constructor(){
setStatusBarColors();
}
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/57732590
复制相关文章
相似问题
腾讯云开发者
