After I updated my Dart extension in VS Code, it doesn't automatically hot-reload my Flutter codes even though I've turned on autosave. Does anyone have an idea about how to solve it?
If you using VS Code, Go to the Settings > Extensions > Dart & Flutter
Then select always in Flutter Hot Reload On Save
Congrats 🥳 Your problem is solved.
PFA screenshot here
Run the flutter doctor command and make sure that flutter is installed properly on your machine.
Which channel are you running on? Make sure that you run on the stable channel, as long as it does not give you any compile time issues.
If the flutter doctor works, then make sure that, if you are running on iOS (Physical Device), that you have bonjour service enabled. This is required in order to make debugging work on physical devices (for iOS 14+). Please also make sure that you add -v command to the end of your deploy function, to increase the log verbosity.
Otherwise you can just deploy to the simulator.
If you are running on Android, there should not be any issues, unless there is a problem with the logcat. In this case you can try to go to android Studio and reboot the ADB (Android Debug Bridge), in which case the machine will try to reattach a debuggable process to your device. If it's still not working, then try another device. If that's not working, then add the -v command, I mentioned earlier, about log verbosity.
Post an update on your issue, once you have tried all of these suggestions.
[EDIT]
Please make sure that hot reload is enabled on the vscode settings.
Go to Settings > Search > Hot Reload, and make sure it's enabled for both Auto Save & Restart.
Please take a look at this image below:
[EDIT ONCE AGAIN]
If you look at the flutter documentation (https://flutter.dev/docs/development/tools/hot-reload) it says, that to run a flutter hot reload, you have to follow these steps:
Run the app from a supported Flutter editor or a terminal window.
Either a physical or virtual device can be the target. Only Flutter
apps in debug mode can be hot reloaded. Modify one of the Dart files
in your project. Most types of code changes can be hot reloaded; for a
list of changes that require a hot restart, see Special cases. If
you’re working in an IDE/editor that supports Flutter’s IDE tools,
select Save All (cmd-s/ctrl-s), or click the hot reload button on the
toolbar.
Make sure that you follow all the steps in the documentation, then let's talk on this post again (https://flutter.dev/docs/development/tools/hot-reload)
Asked and answered over here: Flutter doesn't hot reload on autosave in VSCode. In short, it is working as designed.
The "hot reload on save" feature was intended to run when the user specifically pressed save so they had some control over when it occurred. Some users experienced issues where autosave would cause it to fire when they didn't want it to, so this "bug" was recently fixed.
It turns out that for many users, hot-reload-on-autosave worked fine, so the next version of the Dart extension will include a setting to allow you to re-enable that.
"dart.flutterHotReloadOnSave": "always"
For VS Code Go to 'File' -> 'Auto Save' make sure you have "check" Auto Save.
If you’re running the app at the command line using
flutter run
command, enter r in the terminal window to hot reload.
Try to run by clicking Run button worked in my case.
Like this
I created a NativeScript 7.1 project with Angular 11 using tns create my-blank-ng --template #nativescript/template-blank-ng and then run it using tns run.
The app at first runs perfectly, but it only shows a white screen after saving changes which triggers hot reload.
Is there any way to make HMR work? Disabling HMR could be a workaround, but it's to annoying to have the app restart on each change.
I can't comment, but it seems like although they announced that it now works, with Angular it still does not.
I don't think there's any workarounds at this time. We'll have to wait...
Update: There's also an issue on this at: https://github.com/NativeScript/nativescript-angular/issues/2243
Update 2: Fixed, see accepted answer.
It's a bug - fixed in nativescript-angular#11.0.1
Release note:
https://github.com/NativeScript/nativescript-angular/releases/tag/11.0.1
For the last few weeks I've been developing an app for Android using React Native, and overall the experience is pretty good, however I feel like I might be missing something. Does anyone have any pointers?
My flow is
Start Android Studio
Wait for build/sync
Run app on physical device or AVD
See the expected red screen
Start the Metro server
Now the app is running
Run pidcat com.myapp to see device logs
Make JS changes via VSCode
Hit reload in Flipper (no hot-reloading?)
Re-navigate to the screen I'm working on
So far it's all good other than the lack of hot-reloading.
However whenever I made a change to some Java code, I need to hit Rebuild in Android Studio, and this takes quite some time usually.
Is this all normal? Perhaps I'm missing something.
Thanks in advance
You don't have to start Android studio.
If using Flipper, start Flipper first.
Start metro server in one terminal
run react-native run-android in another terminal.
To reload type r in the terminal with metro server.
Changes to JS side should automatically reflect in the device. ( https://reactnative.dev/docs/fast-refresh )
With react-native you shouldn't be making big changes to the native side of the codes. If reloading doesn't reflect the changes to the native side. Then close the metro server and build again.
I'm a beginner to react native development and for keyboard handling in my current application, I have used react-native-keyboard-manager which works well in iOS. Now for android, it says I need to set android:windowSoftInputMode to adjustResize. I've tried both adjustResize and adjustPan as well but they both behave the same way and my view get squashed up. Below are the screenshots of my view.
View before keyboard appearance
View after keyboard appearance
Am I missing something here? Is there an easy way to fix this? I'm aware of other Libraries like KeyboardAvoidingView, KeyboardSpacer and KeyboardAwareScrollView, but if I use that I would need to implement it in every view and repeat same code to do it separately for android as in iOS it already works very well. Any help is appreciated
If you make changes to native code in your project then you must rebuild your project.
You will not see the updates in your simulator/emulator if you just reload it (ie pressing CMD+R or RR. This is due to the fact that when you reload all you are doing is changing the JavaScript and not the native code.
To effect the changes (usually the best way is to remove the previous build folder first) is to run react-native run-ios or react-native run-android that way you force a rebuild and any changes to your native code are then updated on your simulator/emulator.
Sorry for the complete newbie question but i'm not having much luck.
I've created a project through eclipse with the phonegap plugin and deployed it as an android app onto a tablet to run locally - but I'm getting the 'Note: Navigation may not work if viewed locally' bar being added on the bottom of the pages.
How do I get round this? I thought if it was packaged up in this format I wouldn't have to install an android webserver onto the tablet and run it through the browser?
All guidance is much apreciated.
I had the samme error, and it turned out that jquery.mobile was included twice. Removal of the twin reference resulted in removal of the Note.