How to fix find error for dart:html in VSCode?

Question

I try to run in VSCode a simple dart program with import 'dart:html'; clause.

 import 'dart:html';
    // import 'package:html/dom.dart';
    // import 'package:html/dom_parsing.dart';
    // import 'package:html/parser.dart';

    void main() async{

    var myTable = new TableElement()
        ..setAttribute('border','1');
        // ..setAttribute(name, value); 
    ...

In Run mode (I use VSCode extension "Code Runner 0.9.9") and in Debug appeared the same error:

Error: Not found: 'dart:html'
import 'dart:html';

I have installed Dart SDK 2.3.1 at Windows10 and not installed Flutter at all. PATH pointed to Dart SDK bin directory PATH =D:\Dart\dart-sdk\bin;

*) At project directory I try to add additional directive at pubspec.yaml dependencies:

----
name: main
description: Test App sample22

dependencies:
  html:  
---

After "pub get" command I'll see that html present but error still persist.

pub get
Resolving dependencies...
+ charcode 1.1.2
+ csslib 0.16.0
+ html 0.14.0+2
+ path 1.6.2
+ source_span 1.5.5
+ term_glyph 1.1.0
Changed 6 dependencies!

*) My next step was to import html parts via "package:html/" (marked as comments in code sample). It is not helped and required class TableElement still unrecognizable.

"main.dart:8:19: Error: Method not found: 'TableElement'."

*) I try to change "launch.json" string from

default "program": "bin/main.dart",

to "program": "D:/Dart/WRK03t/main.dart",

And rename my code file to "main.dart"

*) Also I try to remove Dart extension from VSCode, restart PC and install it again. it's not helped.

But let me say that when I compile main.dart to js

"dart2js -m -o tst.js main.dart"

Resulted tst.js run correctly within the html page.

Almost the same problem in Request Dart Installation doesnt find dart:html

If you open a .dart file, what does it show in the bottom-right corner of the status bar between "Dart" and the smiley face? — Danny Tuppeny
Would you mind filing an issue at github.com/Dart-Code/Dart-Code for me to look? Please enable the analyzer instrumentation log (dartcode.org/docs/logging/#analyzer-instrumentation), then restart Code and reproduce the issue, then send a copy of the log. You can disable the logfile after that. Thanks! — Danny Tuppeny
I send an issue to github.com/Dart-Code/Dart-Code with the same name and analyzerinstrum log in attachment. — Dmitry

Danny Tuppeny Danny Tuppeny · Accepted Answer · 2019-06-10T07:33:15

dart:html is only available in the browser. This is the error you get if you try to run code that uses it on the VM (instead of the browser). This is expected.

If you need to run your code outside of the browser (eg. in the VM as a CLI app or via Fluter) you cannot use dart:html. If you only want to use it in the browser but VS Code is trying to run your code in the VM, you'll need to set up some VS Code tasks/launch configs to run build_runner, similar to the Dart DevTools project:

https://github.com/flutter/devtools/tree/abe811f66e1bd36612b76bbe28250bc669a6ce08/.vscode

How to fix find error for dart:html in VSCode?

1 Answers