playground-feedback Building a Good-Looking Login Form

Did you search for the problem in other open issues in this repo? YES

Tell us about the problem

Please, ensure your title is less than 63 characters long and starts with a capital letter.

Did you try it outside of {N} Playground?

Yes - but the behavior is different (give more information)

Preparing project...
Bundling application for entryPath .\app...
File change detected. Starting incremental webpack compilation...

webpack is watching the files…

Hash: be81d46ca507ea90d189
Version: webpack 4.42.1
Time: 4400ms
Built at: 04/22/2020 6:09:45 PM
              Asset       Size   Chunks             Chunk Names
          bundle.js   95.6 KiB   bundle  [emitted]  bundle
    images/logo.png   23.4 KiB           [emitted]  
       package.json  194 bytes           [emitted]  
         runtime.js   71.6 KiB  runtime  [emitted]  runtime
tns-java-classes.js    0 bytes           [emitted]  
          vendor.js   1.66 MiB   vendor  [emitted]  vendor
Entrypoint bundle = runtime.js vendor.js bundle.js
[./ sync ^\.\/app\.(css|scss|less|sass)$] . sync nonrecursive ^\.\/app\.(css|scss|less|sass)$ 174 bytes {bundle} [built]
[./ sync recursive (?<!\bApp_Resources\b.*)(?<!\.\/\btests\b\/.*?)\.(xml|css|js|kt|(?<!\.d\.)ts|(?<!\b_[\w-]*\.)scss)$] . sync (?<!\bApp_Resources\b.*)(?<!\.\/\btests\b\/.*?)\.(xml|css|js|kt|(?<!\.d\.)ts|(?<!\b_[\w-]*\.)scss)$ 243 bytes {bundle} [built]
[./app.css] 1.22 KiB {bundle} [optional] [built]
[./app.js] 1.99 KiB {bundle} [built]
[./routes/index.js] 149 bytes {bundle} [built]
[./services/backend-service.js] 698 bytes {bundle} [built]
[@nativescript/core/application] external "@nativescript/core/application" 42 bytes {bundle} [built]
[kinvey-nativescript-sdk] external "kinvey-nativescript-sdk" 42 bytes {bundle} [built]
[nativescript-vue] external "nativescript-vue" 42 bytes {bundle} [built]
[tns-core-modules/application] external "tns-core-modules/application" 42 bytes {bundle} [built]
[tns-core-modules/bundle-entry-points] external "tns-core-modules/bundle-entry-points" 42 bytes {bundle} [built]
[tns-core-modules/file-system] external "tns-core-modules/file-system" 42 bytes {bundle} [built]
[tns-core-modules/ui/frame] external "tns-core-modules/ui/frame" 42 bytes {bundle} [built]
[tns-core-modules/ui/frame/activity] external "tns-core-modules/ui/frame/activity" 42 bytes {bundle} [built]
[tns-core-modules/ui/styling/style-scope] external "tns-core-modules/ui/styling/style-scope" 42 bytes {bundle} [built]
    + 68 hidden modules
Webpack compilation complete. Watching for file changes.
Webpack build done!
Project successfully prepared (android)
Start sending initial files for device thamibn (2f9fb90c-22cc-4e13-963c-6b732a6330ee).
Successfully sent initial files for device thamibn (2f9fb90c-22cc-4e13-963c-6b732a6330ee).
If you are using loginWithMIC() ensure that you have added nsplayresume:// as a Redirect URI to your Mobile Identity Connect configuration at https://console.kinvey.com in order for Mobile Identity Connect login to work in the Preview app.
Preparing project...
Project successfully prepared (android)
Start sending initial files for device thamibn (2f9fb90c-22cc-4e13-963c-6b732a6330ee).
Successfully sent initial files for device thamibn (2f9fb90c-22cc-4e13-963c-6b732a6330ee).
Error: PubNub call failed, check status for details
    at new PubNubError (C:\Users\tasen\AppData\Roaming\npm\node_modules\nativescript\node_modules\pubnub\lib\core\components\core\components\endpoint.js:8:31)
    at onResponse (C:\Users\tasen\AppData\Roaming\npm\node_modules\nativescript\node_modules\pubnub\lib\core\components\core\components\endpoint.js:126:32)
    at <anonymous> (C:\Users\tasen\AppData\Roaming\npm\node_modules\nativescript\node_modules\pubnub\lib\networking\modules\networking\modules\web-node.js:59:17)
    at Request.callback (C:\Users\tasen\AppData\Roaming\npm\node_modules\nativescript\node_modules\superagent\lib\node\index.js:728:3)
    at RequestBase._timeoutError (C:\Users\tasen\AppData\Roaming\npm\node_modules\nativescript\node_modules\superagent\lib\request-base.js:676:8)
    at Timeout.<anonymous> (C:\Users\tasen\AppData\Roaming\npm\node_modules\nativescript\node_modules\superagent\lib\request-base.js:685:12)
    at listOnTimeout (internal/timers.js:549:17)
    at processTimers (internal/timers.js:492:7)

Which browser are you using?

Chrome

Are there any errors/warnings logged in your browser console?

Which platform(s) does your issue occur on?

Android

Are there any entries logged in the Device Logs tab?

Preparing project...
Bundling application for entryPath .\app...
File change detected. Starting incremental webpack compilation...

webpack is watching the files…

Hash: be81d46ca507ea90d189
Version: webpack 4.42.1
Time: 4400ms
Built at: 04/22/2020 6:09:45 PM
              Asset       Size   Chunks             Chunk Names
          bundle.js   95.6 KiB   bundle  [emitted]  bundle
    images/logo.png   23.4 KiB           [emitted]  
       package.json  194 bytes           [emitted]  
         runtime.js   71.6 KiB  runtime  [emitted]  runtime
tns-java-classes.js    0 bytes           [emitted]  
          vendor.js   1.66 MiB   vendor  [emitted]  vendor
Entrypoint bundle = runtime.js vendor.js bundle.js
[./ sync ^\.\/app\.(css|scss|less|sass)$] . sync nonrecursive ^\.\/app\.(css|scss|less|sass)$ 174 bytes {bundle} [built]
[./ sync recursive (?<!\bApp_Resources\b.*)(?<!\.\/\btests\b\/.*?)\.(xml|css|js|kt|(?<!\.d\.)ts|(?<!\b_[\w-]*\.)scss)$] . sync (?<!\bApp_Resources\b.*)(?<!\.\/\btests\b\/.*?)\.(xml|css|js|kt|(?<!\.d\.)ts|(?<!\b_[\w-]*\.)scss)$ 243 bytes {bundle} [built]
[./app.css] 1.22 KiB {bundle} [optional] [built]
[./app.js] 1.99 KiB {bundle} [built]
[./routes/index.js] 149 bytes {bundle} [built]
[./services/backend-service.js] 698 bytes {bundle} [built]
[@nativescript/core/application] external "@nativescript/core/application" 42 bytes {bundle} [built]
[kinvey-nativescript-sdk] external "kinvey-nativescript-sdk" 42 bytes {bundle} [built]
[nativescript-vue] external "nativescript-vue" 42 bytes {bundle} [built]
[tns-core-modules/application] external "tns-core-modules/application" 42 bytes {bundle} [built]
[tns-core-modules/bundle-entry-points] external "tns-core-modules/bundle-entry-points" 42 bytes {bundle} [built]
[tns-core-modules/file-system] external "tns-core-modules/file-system" 42 bytes {bundle} [built]
[tns-core-modules/ui/frame] external "tns-core-modules/ui/frame" 42 bytes {bundle} [built]
[tns-core-modules/ui/frame/activity] external "tns-core-modules/ui/frame/activity" 42 bytes {bundle} [built]
[tns-core-modules/ui/styling/style-scope] external "tns-core-modules/ui/styling/style-scope" 42 bytes {bundle} [built]
    + 68 hidden modules
Webpack compilation complete. Watching for file changes.
Webpack build done!
Project successfully prepared (android)
Start sending initial files for device thamibn (2f9fb90c-22cc-4e13-963c-6b732a6330ee).
Successfully sent initial files for device thamibn (2f9fb90c-22cc-4e13-963c-6b732a6330ee).
If you are using loginWithMIC() ensure that you have added nsplayresume:// as a Redirect URI to your Mobile Identity Connect configuration at https://console.kinvey.com in order for Mobile Identity Connect login to work in the Preview app.
Preparing project...
Project successfully prepared (android)
Start sending initial files for device thamibn (2f9fb90c-22cc-4e13-963c-6b732a6330ee).
Successfully sent initial files for device thamibn (2f9fb90c-22cc-4e13-963c-6b732a6330ee).
Error: PubNub call failed, check status for details
    at new PubNubError (C:\Users\tasen\AppData\Roaming\npm\node_modules\nativescript\node_modules\pubnub\lib\core\components\core\components\endpoint.js:8:31)
    at onResponse (C:\Users\tasen\AppData\Roaming\npm\node_modules\nativescript\node_modules\pubnub\lib\core\components\core\components\endpoint.js:126:32)
    at <anonymous> (C:\Users\tasen\AppData\Roaming\npm\node_modules\nativescript\node_modules\pubnub\lib\networking\modules\networking\modules\web-node.js:59:17)
    at Request.callback (C:\Users\tasen\AppData\Roaming\npm\node_modules\nativescript\node_modules\superagent\lib\node\index.js:728:3)
    at RequestBase._timeoutError (C:\Users\tasen\AppData\Roaming\npm\node_modules\nativescript\node_modules\superagent\lib\request-base.js:676:8)
    at Timeout.<anonymous> (C:\Users\tasen\AppData\Roaming\npm\node_modules\nativescript\node_modules\superagent\lib\request-base.js:685:12)
    at listOnTimeout (internal/timers.js:549:17)
    at processTimers (internal/timers.js:492:7)

Please provide the following information shown in the devices tab in the playground:

Model
OS version
Preview app version
Runtime version

Please tell us how to recreate the issue with as much detail as possible.

The best approach would be to get your code running in the {N} Playground and share the link with us, along with any additional details or steps to reproduce needed for examining the issue there.

Apr 22 '20 16:04 thamsanca-abanganimedia

I've had many of similar errors. Some things to look at/try: -Internet: if you're having trouble with other applications (web browser, email,...) during the pandemic, could lead to this. -Too many apps on phone: Mine is iPhone, but I had about 130 apps installed. offloading soe of these seemed to help, though can't prove it was the deciding thing. -Latest versions: Nativescript cli at 6.4 or higher. -Iffy cable connection.

Maybe you could fill out the requested model and version info

Apr 22 '20 19:04 EdJones

Thanks for the quick reply indeed it was my internet connection.

Another error I have with the demo login template for Vue is the css seems it's the old css [nativescript-theme/core/css/core.light.css] the app complains when I run it that this module doesn't exist I have just downloaded the example run npm I still it complains that the module doesn't exist.

Any idea to solve this error.

Apr 22 '20 20:04 thamibn

It seems like the demos are not updated to the latest updates?

Apr 22 '20 20:04 thamibn

@thamibn Yes, I think the demos could almost all use a spring cleaning. Even when they function, the code tends to be reflective of rather outdated ways of doing things.

Themes did indeed have breaking changes along the way. So read those instructions carefully.

Also, the standard location and references for npm modules is now '/node_modules. Some of the demos used other locations.

Apr 23 '20 12:04 EdJones