Thiết kế website giá rẻ

Question

I’m using Ionic version 7.2.0, npm version 10.8.2, angular 18.1.1, node 20.16.0, Capacitor version 6.1.1, phone api 27, windows 11 64 bits, jdk-17 (I had to install and uninstall several java versions because it kept giving me compatibility erros, besides changing enviroment variables).

I created a basic ionic project with ionic start, and angular, I tried with many default templates, for example the tabs template and I get the same error.

After creation, I ran ng build, followed by npx cap copy, npx cap sync,ionic capacitor add android and ionic capacitor run android.

After running ng build I get small warnings in yellow:

 Generating index html...20 rules skipped due to selector errors:   
  :host-context([dir=rtl]) .ion-float-start -> Unknown pseudo-class :host-context([object Object])
  .ion-float-start:dir(rtl) -> Unknown pseudo-class :dir
  :host-context([dir=rtl]) .ion-float-end -> Unknown pseudo-class :host-context([object Object])
  .ion-float-end:dir(rtl) -> Unknown pseudo-class :dir
  :host-context([dir=rtl]) .ion-float-sm-start -> Unknown pseudo-class :host-context([object Object])
  .ion-float-sm-start:dir(rtl) -> Unknown pseudo-class :dir
  :host-context([dir=rtl]) .ion-float-sm-end -> Unknown pseudo-class :host-context([object Object])
  .ion-float-sm-end:dir(rtl) -> Unknown pseudo-class :dir
  :host-context([dir=rtl]) .ion-float-md-start -> Unknown pseudo-class :host-context([object Object])
  .ion-float-md-start:dir(rtl) -> Unknown pseudo-class :dir
  :host-context([dir=rtl]) .ion-float-md-end -> Unknown pseudo-class :host-context([object Object])
  .ion-float-md-end:dir(rtl) -> Unknown pseudo-class :dir
  :host-context([dir=rtl]) .ion-float-lg-start -> Unknown pseudo-class :host-context([object Object])
  .ion-float-lg-start:dir(rtl) -> Unknown pseudo-class :dir
  :host-context([dir=rtl]) .ion-float-lg-end -> Unknown pseudo-class :host-context([object Object])
  .ion-float-lg-end:dir(rtl) -> Unknown pseudo-class :dir
  :host-context([dir=rtl]) .ion-float-xl-start -> Unknown pseudo-class :host-context([object Object])
  .ion-float-xl-start:dir(rtl) -> Unknown pseudo-class :dir
  :host-context([dir=rtl]) .ion-float-xl-end -> Unknown pseudo-class :host-context([object Object])
  .ion-float-xl-end:dir(rtl) -> Unknown pseudo-class :dir

The other commands dont show any warning or errors. When I run Ionic Serve the app shows normally in the browser and works without any warnings, but running on the emulator, it shows the app as a blank screen.

In chrome devices my emulator shows as:

Remote Target
#LOCALHOST
Android SDK built for x86
#EMULATOR-5554
WebView in io.ionic.starter (61.0.3163.98)

In the console I see the following errors and warnings:

Warning The key "viewport-fit" is not recognized and ignored.
localhost/:820 

SyntaxError: Unexpected token {
cap.handleError.err @ localhost/:820
/polyfills.45b15749fa958a1d.js:1 

Uncaught SyntaxError: Unexpected token {
localhost/:820 SyntaxError: Unexpected token {
cap.handleError.err @ localhost/:820
/main.c16a3b803172a61a.js:1 

Uncaught SyntaxError: Unexpected token {

Opening the android folder after build with ionic capacitor build android, the project doesnt show any IDE errors inside android studio. Running the app from there and inspecting logcat I see the same errors as in Chrome devices:

W  Attempt to remove non-JNI local reference, dumping thread

W  File: https://localhost/ - Line 1298 - Msg: The key "viewport-fit" is not recognized and ignored.

E  Style contains key with bad entry: 0x01010586

E  [ERROR:gl_surface_egl.cc(289)] eglChooseConfig failed with error EGL_SUCCESS

E  File: https://localhost/ - Line 820 - Msg: SyntaxError: Unexpected token {

E  File: https://localhost/polyfills.45b15749fa958a1d.js - Line 1 - Msg: Uncaught SyntaxError: Unexpected token {

E  JavaScript Error: {"type":"js.error","error":{"message":"Uncaught SyntaxError: Unexpected token {","url":"https://localhost/main.c16a3b803172a61a.js","line":1,"col":11,"errorObject":"{}"}}

E File: https://localhost/ - Line 820 - Msg: SyntaxError: Unexpected token {

E  File: https://localhost/main.c16a3b803172a61a.js - Line 1 - Msg: Uncaught SyntaxError: Unexpected token {

What is causing this and how can I solve it?

Thiết kế website giá rẻ

Danh mục

Ionic 7 default app showing blank screen and errors when running on emulator