I am developing a web app in Dart using Webstorm as IDE. After upgrading from Dart SDK 2.2 to Dart SDK 2.3 I noticed that all breakpoints I set in Webstorm are ignored (although the app seems to run properly in Chrome) That breakpoints are correctly marked as a "red circle" but unlike the previous SDK they miss the "tick" inside (which I think means they are not recognized by Chrome).
I tried to "repair cache" and "upgrade dependencies" but breakpoints still don't work.
That's the pubspec.yaml dev_dependencies:
dev_dependencies:
build_runner: ^1.4.0
build_test: ^0.10.7+3
build_web_compilers: ^2.1.0
Here is the "webdev serve" command:
/dart/2.3.1/dart-sdk/bin/pub global run webdev serve web:53321
Here is the "webdev serve" command result:
[INFO] Serving `web` on http://localhost:53321
[INFO] Running build completed, took 351ms
[INFO] Caching finalized dependency graph completed, took 177ms
[INFO] Succeeded after 536ms with 0 outputs (0 actions)
Here the versions of envolved softwares:
- O.S.: macOS High Sierra 10.13.6
- Chrome: 74.0.3729.169
- Webstorm: 2019.1 - Build 191.7141.49
- Dart SDK: 2.3.1
- Dart webdev: 2.0.5
I'm trying to figure out if the issue is related to Webstorm, Dart SDK or Chrome. I don't exclude that I miss some new configuration due to the Dart SDK upgrade. Downgrading back to Dart SDK 2.2 everything works fine. Thank you for your hints.
Reproduced, logged as WEB-39095. Please follow it for updates
The bug was in webdev 2.0.0 - 2.0.6. It is fixed in webdev 2.0.7. You may run pub global activate webdev to get the latest version. You might need to close/open the project in the IDE to get it working.
Related
I can't debug my react native / expo app in WebStorm, but I can in Visual Studio Code.
I have a react native app that I can successfully run using expo. I set up the configuration according to the info on this site:
https://blog.jetbrains.com/webstorm/2018/02/webstorm-2018-1-eap-181-3263/#debugging-expo
When I click "run" or "debug" and "Debug JS Remotely" is turned off, the bundler builds a JS bundle and the app starts on my devices.
But once I turn on "Debug JS Remotely", the bundler only says:
Starting custom debugger by executing: : [my working directory] [my working directory again]
and never goes on to build the JS bundle.
After a short while, a red screen appears on the device, and it says:
Unable to connect with remote debugger
Timeout while connecting to remote debugger
onFailure
DevSupportManagerImpl.java:851
onFailure
WebsocketJavaScriptExecutor.java:83
run
WebsocketJavaScriptExecutor.java:142
handleCallback
Handler.java:790
dispatchMessage
Handler.java:99
...
The bundler doesn't say anything more than the message above.
As soon as I turn off remote debugging, the the bundler starts building again and finishes with
"Building JavaScript bundle: finished in ...ms"
as usual, but the device, again, shows the red screen with aforementioned messages, or doesn't show anything but the regular white screen with a message at the bottom saying "Downlading JavaScript bundle 100,00%". I either have to stop and restart within WebStorm or I have to close the expo app and re-open it. Either way will make the app start again on my device.
This is my first time working with javascript, react native, expo, so I am not sure, but it should be possible to debug in WebStorm directly, right? As mentioned, in Visual Studio Code everything including debugging works fine, so I don't think it's anything in the code. Maybe someone here has an idea where the problem lies?
node -v: v11.6.0
react-native -v: react-native-cli: 2.0.1, react-native: 0.57.1
Any help will be greatly appreciated! Thanks in advance!
PROOF
HOWTO
Looks like there's been an update to how you can setup Configurations since you tried.
Try changing the Bundler host to 127.0.0.1 and try again.
I just setup Webstorm v2020.2 yesterday to debug my Expo application and it is working as expected.
These instructions were all that I required: https://www.jetbrains.com/help/webstorm/react-native.html#ws_react_native_create_run_config
On the main menu, go to Run | Edit Configurations, click icons.general.add.svg and select React Native from the list. The Run/Debug Configuration: React Native opens.
Choose whether you want WebStorm to build and launch the application for you:
Select the Build and launch checkbox if you are launching your application for the first time or if you have updated its native code since the last run.
If your application uses Expo, clear the checkbox because this bundler takes care of the process itself.
If you selected the Build and launch checkbox, choose the target platform, Android or iOS. Depending on your choice, WebStorm will run the bundler with react-native run-ios or with react-native run-android.
Optionally, type the arguments to be passed to React Native, for example, specify the simulator type through the ‑‑simulator flag: ‑‑simulator="iPhone 4s".
In the Bundler host field, specify the host where the React Native bundler runs, the default value is localhost.
If you are using Expo, change the default bundler host to ensure successful connection with the debugger. This connection may fail because WebStorm by default uses localhost to start debugging while Expo expects 127.0.0.1 or an external IP address depending on what is selected in Connection field of the Metro bundler configuration. See Debugging a React Native application that uses Expo for details.
In the Bundler port field, specify the port on which the React Native bundler runs, by default 8081 is chosen, learn more from the React Native official website.
Choose the Node.js interpreter to use. This can be a local Node.js interpreter or a Node.js on Windows Subsystem for Linux.
Specify the path to react-native-cli and the working directory of the application. Optionally, type the environment variables for react-native run-android or react-native run-ios.
By default, WebStorm starts the React Native bundler automatically when you invoke the run/debug configuration. If you have already started the bundler from outside WebStorm, for example, from the command line, you can re-use it without stopping and restarting. Select your bundler in the Before Launch area and click Remove.
The issue is tracked at WEB-35719, please follow it for updates
I have made good progress with Flutter on mobile apps. Currently using:
[✓] Flutter (Channel master, v0.3.1-pre.13, on Mac OS X 10.13.4 17E199, locale en-US)
• Flutter version 0.3.1-pre.13 at /Users/golftocs/PhpstormProjects/flutter
• Framework revision 85be28d36b (32 hours ago), 2018-04-16 14:02:07 -0700
• Engine revision 76cb311d9c
• Dart version 2.0.0-dev.47.0.flutter-f76dad0adc
[✓] Android toolchain - develop for Android devices (Android SDK 27.0.1)
• Android SDK at /Users/golftocs/Library/Android/sdk
• Android NDK location not configured (optional; useful for native profiling support)
• Platform android-27, build-tools 27.0.1
• ANDROID_HOME = /Users/golftocs/Library/Android/sdk
• Java binary at: /Applications/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java
• Java version OpenJDK Runtime Environment (build 1.8.0_152-release-1024-b01)
• All Android licenses accepted.
[✓] iOS toolchain - develop for iOS devices (Xcode 9.3)
• Xcode at /Applications/Xcode.app/Contents/Developer
• Xcode 9.3, Build version 9E145
• ios-deploy 1.9.2
• CocoaPods version 1.5.0
[✓] Android Studio (version 3.1)
• Android Studio at /Applications/Android Studio.app/Contents
• Flutter plugin version 23.1.2
• Dart plugin version 173.4700
• Java version OpenJDK Runtime Environment (build 1.8.0_152-release-1024-b01)
[!] Connected devices
! No devices available
Now I want to begin a project that uses this Flutter set-up for mobile and share code with a Dart2/Angular web app. I am unable to get a web app working successfully. I've cloned https://github.com/angular-examples/toh-5 and based on running 'pub get' this is returned:
Overriding the upper bound Dart SDK constraint to <=2.0.0-
edge.0d5cf900b021bf5c9fa593ffa12b15bcd1cc5fe0 for the following packages:
archive, args, barback, bazel_worker, boolean_selector, build_barback,
build_config, build_modules, charcode, cli_util, code_transformers,
convert, crypto, csslib, dart_style, fixnum, front_end, glob, graphs,
html, http, http_multi_server, http_parser, intl, io, isolate, js,
json_annotation, kernel, logging, matcher, meta, multi_server_socket,
node_preamble, package_config, package_resolver, path, plugin, pool,
protobuf, pub_semver, quiver, quiver_hashcode, shelf,
shelf_packages_handler, shelf_static, shelf_web_socket,
source_map_stack_trace, source_maps, source_span, stack_trace,
stream_channel, string_scanner, term_glyph, test, tuple, typed_data, yaml
Then, when I run 'pub run build_runner serve' from my terminal I get:
[INFO] Generating build script completed, took 446ms
[INFO] Setting up file watchers completed, took 25ms
[INFO] Waiting for all file watchers to be ready completed, took 199ms
[INFO] Building new asset graph completed, took 921ms
[INFO] Checking for unexpected pre-existing outputs. completed, took 2ms
[SEVERE] build_web_compilers|ddc on package:angular_router/src/url.module:
ProcessException: No such file or directory
Command: /Users/golftocs/PhpstormProjects/flutter/bin/cache/dart-sdk/bin/dartdevc --persistent_worker
[WARNING] build_web_compilers|entrypoint on web/main.dart:
Unable to read angular_router|lib/src/url.ddc.js, check your console or the `.dart_tool/build/generated/angular_router/lib/src/url.ddc.js.errors` log file.
[SEVERE] build_web_compilers|ddc on package:angular_router/src/location/platform_location.module:
ProcessException: No such file or directory
Command: /Users/golftocs/PhpstormProjects/flutter/bin/cache/dart-sdk/bin/dartdevc --persistent_worker
[WARNING] build_web_compilers|entrypoint on web/main.dart:
Unable to read angular_router|lib/src/location/platform_location.ddc.js, check your console or the `.dart_tool/build/generated/angular_router/lib/src/location/platform_location.ddc.js.errors` log file.
...
Additionally, I am using WebStorm, actually PHPStorm, and the Pub actions links to 'Get Dependencies, Upgrade...' do not work. I can only execute from terminal.
My desire is to get to:
1) share code between mobile & web similar to https://github.com/apptreesoftware/letsvote/blob/master/README.md
2) run latest Dart2 with Angular5.0.0-alpha and current Flutter master channel
3) WebStorm IDE work seamlessly with either from a combined project
Thanks.
shared_code
|- flutter_project
|- angular_project
where both flutter_project and angular_project have shared-code as a dependency in pubspec.yaml
dependencies:
shared_code:
path: ../shared_code
assuming a directory structure like
my_project/shared_code
my_project/flutter_project
my_project/angular_project
The code in shared_code must not depend in any way on dart:io or flutter:ui otherwise it won't work with either flutter_project or angular_project
If you want to open all 3 at the same time in IntelliJ in the same window, adding them all as module to a single project worked for me.
When I work on the Angular project I need to switch the Dart SDK in the Dart plugin to the Dart SDK, when I work on the Flutter project to the Flutter Dart SDK, otherwise running the app and tests doesn't work.
You can also open each project in its own IntelliJ window which keeps the setting for each window individually and doesn't need to switch depending on what code you're currently working.
I got this error
`FAILURE: Build failed with an exception.
What went wrong?
Execution failed for task ':transformClassesWithDexForDebug'.
com.android.build.api.transform.TransformException: com.android.ide.common.process.ProcessException: java.util.concurrent.ExecutionException: com.android.dex.DexException: Multiple dex files define Lcom/google/zxing/BarcodeFormat;
`
I have enabled Multidex (multiDexEnabled = true) in build.gradle and also added following
dexOptions {
incremental = true;
preDexLibraries = false
javaMaxHeapSize "2g"
}
but still getting that error.
Even I was facing the similar issue, I tried updating Cordova, Ionic and setting ANDROID_HOME and JAVA_HOME and almost all the solution over the web, but nothing worked for me. Finally, it was the issue with PhoneGap-push plugin. The 2.0 version of PhoneGap-push plugin has some collision with some plugins like
Google Analytics
To be more specific the plugins that use google play services.
So Below is my solution.
First, remove the PhoneGap-push plugin 2.0 from your application.
Now try to build the app by commenting all the lines that use push plugin.
If the build is successful then it will be the issue with push plugin. Then follow below instructions to fix the issue. If the build is not successful then you might be having some other issue.
First, uninstall the PhoneGap-push plugin 2.0
Then go to project -> package.json and search for push and replace the line with “”: “4.0.1” earlier it will be 4.3.0 or 4.3.1
Now add push plugin again to the project with below command ionic plugin add phonegap-plugin-push#1.10.5 --variable SENDER_ID=XXXXXXX
Now build your app works like a charm....
This issue is already opened in phonegap-pushplugin repo . They have a next milestone of releasing version 2.1.0 which will be fixing this issue.
Livereload
I'm having problems getting Ember CLI (1.13.15) to detect changes. When I create a new application with
ember init
And run the development server with
ember serve
The project compiles and I see the page. When I change something, the server detects changes in the console, but nothing happens even if I refresh page. The changes become visible only after I rerun the ember serve
Slow build
Also on an empty app it takes 30 sec to build app on Samsung 850 Pro SSD & i7 2600k with admin rights and after ember-cli-windows run. (the build on half slower MacBook Air is almost instantaneous).
Versions
Windows 10 with all the updates
ember-cli: 1.13.15
node: 4.2.6
npm: 2.14.10
I just encountered this as well -- seemingly out of nowhere, at once, on several different projects. Making sure I had this in .ember-cli was a winning fix:
"liveReload": true,
"watcher": "polling"
[Update]
I already had liveReload: true, so adding the watcher setting seems to be what was needed. Furthermore the projects that I implemented this for were using ember-cli at 1.13.13, 2.2.0-beta.6 and 2.3.0-beta.1, with the following system config:
node: 4.2.4
npm: 2.14.10
os: darwin x64
There's currently a known issue in ember-cli where the open port for livereload isn't detected correctly (https://github.com/ember-cli/ember-cli/pull/5391). You should be able to get around this for now by running ember serve --host 0.0.0.0.
For now, the best solution seems to be sticking to the old versions. Also there seems to be an issue with latest sass plugin not recognizing changes so I recommend downgrading both to:
ember-cli: 1.13.8,
ember-cli-sass: 4.2.1
I'm trying to get debugging to work on ff/chrome. I've checked all the post that come up when you google.
What I've done:
- setup a ff profile
- setup a in place deployment and double checked the remote urls..
- all plugins are enabled (including Javascript debugger)
As it seems the webstorm debugging extension was not installed in firefox (or chrome). I cannot find anything on how to get it installed. (I've allready tried re-installing Webstorm)
When I debug a file, firefox opens, but displays no page and the url-bar is empty..
I'm using Webstorm 4.0 and Firefox 11
Although this post might be outdated:
You need to install the JetBrains IDE extension in the corresponding browser.
When this is done, check if the same host and port are specified for Webstorm as well as for the extension as well.