Sdk: dart2js - Uncaught SyntaxError: Unexpected token )

[TheDumbfounds]

When creating a project with AngularDart and running pub build (I tried it with --mode=debug), either the main.dart.js or key_events.dart give me the error in the title.

I created a simple program and only added a button to the app_component.dart

still, it doesn't work.

best greetings

[vsmenon]

Can you give repro instructions? Is this with a starter app?

[TheDumbfounds]

Here is exactly what I did:

I created an app (web-angular-simple) using stagehand. Without chaning anything, I ran pub build. I opened the index.html file in the new folder and it worked fine. So I went on to my web server, created a new folder (subdirectory), took all the files inside the newly built web folder and copied them over.
When going to my site, I saw that the main.dart file and styles.css file weren't recognized properly. So I just changed their src attribute inside of index.html.

Doing so lead to the Uncaught SyntaxeError. Sometimes it shows it in main.dart on the last line, and sometimes in the key_events.dart on line 16.

[kevmoo]

@GeeEm can you share your Dart SDK version and the content of pubspec.lock?

[TheDumbfounds]

@kevmoo my dart vm is on version 1.22.0.

This is the pubspec.lock file:

# Generated by pub
# See http://pub.dartlang.org/doc/glossary.html#lockfile
packages:
  analyzer:
    description:
      name: analyzer
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.29.10"
  angular2:
    description:
      name: angular2
      url: "https://pub.dartlang.org"
    source: hosted
    version: "2.2.0"
  args:
    description:
      name: args
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.13.7"
  async:
    description:
      name: async
      url: "https://pub.dartlang.org"
    source: hosted
    version: "1.13.2"
  barback:
    description:
      name: barback
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.15.2+10"
  browser:
    description:
      name: browser
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.10.0+2"
  build:
    description:
      name: build
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.5.0"
  charcode:
    description:
      name: charcode
      url: "https://pub.dartlang.org"
    source: hosted
    version: "1.1.1"
  cli_util:
    description:
      name: cli_util
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.0.1+2"
  code_transformers:
    description:
      name: code_transformers
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.5.1"
  collection:
    description:
      name: collection
      url: "https://pub.dartlang.org"
    source: hosted
    version: "1.14.0"
  convert:
    description:
      name: convert
      url: "https://pub.dartlang.org"
    source: hosted
    version: "2.0.1"
  crypto:
    description:
      name: crypto
      url: "https://pub.dartlang.org"
    source: hosted
    version: "2.0.1"
  csslib:
    description:
      name: csslib
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.13.4"
  dart_style:
    description:
      name: dart_style
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.2.16"
  dart_to_js_script_rewriter:
    description:
      name: dart_to_js_script_rewriter
      url: "https://pub.dartlang.org"
    source: hosted
    version: "1.0.2"
  fixnum:
    description:
      name: fixnum
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.10.5"
  glob:
    description:
      name: glob
      url: "https://pub.dartlang.org"
    source: hosted
    version: "1.1.3"
  html:
    description:
      name: html
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.13.1"
  http_parser:
    description:
      name: http_parser
      url: "https://pub.dartlang.org"
    source: hosted
    version: "3.1.1"
  intl:
    description:
      name: intl
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.14.0"
  isolate:
    description:
      name: isolate
      url: "https://pub.dartlang.org"
    source: hosted
    version: "1.0.0"
  js:
    description:
      name: js
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.6.1"
  logging:
    description:
      name: logging
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.11.3+1"
  meta:
    description:
      name: meta
      url: "https://pub.dartlang.org"
    source: hosted
    version: "1.0.5"
  mime:
    description:
      name: mime
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.9.3"
  observable:
    description:
      name: observable
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.14.0+1"
  package_config:
    description:
      name: package_config
      url: "https://pub.dartlang.org"
    source: hosted
    version: "1.0.0"
  path:
    description:
      name: path
      url: "https://pub.dartlang.org"
    source: hosted
    version: "1.4.1"
  plugin:
    description:
      name: plugin
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.2.0"
  pool:
    description:
      name: pool
      url: "https://pub.dartlang.org"
    source: hosted
    version: "1.3.0"
  protobuf:
    description:
      name: protobuf
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.5.3+2"
  shelf:
    description:
      name: shelf
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.6.7+2"
  shelf_static:
    description:
      name: shelf_static
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.2.4"
  source_maps:
    description:
      name: source_maps
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.10.4"
  source_span:
    description:
      name: source_span
      url: "https://pub.dartlang.org"
    source: hosted
    version: "1.3.1"
  stack_trace:
    description:
      name: stack_trace
      url: "https://pub.dartlang.org"
    source: hosted
    version: "1.7.3"
  stream_channel:
    description:
      name: stream_channel
      url: "https://pub.dartlang.org"
    source: hosted
    version: "1.6.1"
  string_scanner:
    description:
      name: string_scanner
      url: "https://pub.dartlang.org"
    source: hosted
    version: "1.0.1"
  typed_data:
    description:
      name: typed_data
      url: "https://pub.dartlang.org"
    source: hosted
    version: "1.1.3"
  utf:
    description:
      name: utf
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.9.0+3"
  watcher:
    description:
      name: watcher
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.9.7+3"
  when:
    description:
      name: when
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.2.0"
  which:
    description:
      name: which
      url: "https://pub.dartlang.org"
    source: hosted
    version: "0.1.3"
  yaml:
    description:
      name: yaml
      url: "https://pub.dartlang.org"
    source: hosted
    version: "2.1.12"
sdks:
  dart: ">=1.22.0 <2.0.0"

[kevmoo]

Can you share your html file?

Pro tip: use fenced code blocks when pasting in code - https://help.github.com/articles/creating-and-highlighting-code-blocks/

[TheDumbfounds]

Thanks for the tip. Here is the index.html:

<!DOCTYPE html>
<html>
  <head>
    <script>
        // WARNING: DO NOT set the <base href> like this in production!
        // Details: https://webdev.dartlang.org/angular/guide/router
        (function () {
            // App being served out of web folder (like WebStorm does)?
            var match = document.location.pathname.match(/^\/[-\w]+\/web\//);
            var href = match ? match[0] : '/';
            document.write('<base href="' + href + '" />');
        }());
    </script>

    <title>Hello Angular</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" type="text/css" href="styles.css">

    <script defer src="main.dart" type="application/dart"></script>
    <script defer src="packages/browser/dart.js"></script>

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons"
      rel="stylesheet">
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
      <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
  </head>
  <body>
    <my-app>
    </my-app>
  </body>
</html>

[rakudrama]

Does the browser tell you where the error is? Which file and line?
Did you run __pub build__ ?
The index.html you show has <script defer src="main.dart" type="application/dart"></script>
The generated index.html should have the reference to main.dart rewritten to main.dart.js
You can verify this by looking at the page source when in the working versions of the app.

[TheDumbfounds]

Yep, I did run pub build and it does reference main.dart.js I just included the wrong file here, sorry.
It either gives me an error in main.dart.js on the last line or in key_events.dart in line 16.

I tried uploading it on Github pages and it works completely fine. Can it have to do with the server and that I uploaded it in a subdirectory?

[fleugzeug]

Hi,
I was also confronted with this problem.
For me the problem came from filezilla that had to pass the type of transfer in binary.
I hope it can help others ...

[kevmoo]

@fleugzeug – which version of Dart are you running?

[bostone]

I'm having similar issue. Here are the steps:

1. Generate demo project following angulardart guide
2. Run webdev serve to verify that code works (it does)
3. Create Firebase web starter project in the same top directory and run firebase serve --only hosting to verify that the default Firebase code shows at localhost:5000 (it does serving public/index.html)
4. Modify firebase.json to run app from web folder rather than public. Simply set "public": "web"
5. Now run webdev build just to make sure that the dart code is built
6. Run firebase serve --only hosting again and goto localhost:5000

At this point you will see Loading... andUncaught SyntaxError: Unexpected token < message in console. That is because generated main.dart.js is a not a JS file but exact copy of index.html which starts with <!DOCTYPE html>

This is in latest everything (Dart2 etc) as of 12/14/2018 running on Mac

[afpatmin]

I have the same run into the same issue as @bostone only difference is I use Windows

Edit:
The console output is Uncaught SyntaxError: Unexpected token < in main.dart.js:1

After testing a bit more I realized the crash only occurs when loading a sub page of the site - as in pasting the link into the browser and hitting refresh, navigating to the page normally via routerLinks works as expected. Furthermore this only seems to happen on links that are more than two levels: https://mypage.com/directory1 works, https://mypage.com/directory1/directory doesn't.

[supermuka]

@afpatmin, did you find any solution or work around?

[afpatmin]

@supermuka Unfortunately no permanent solution but I'm using routerProvidersHash as a temporary workaround

[kleinpetr]

I have exactly the same problem with firebase hosting. Did anyone solved it?

[afpatmin]

@kleinpetr I managed to solve it by moving <base href="/"> to the very top of <head>

[kleinpetr]

@kleinpetr I managed to solve it by moving <base href="/"> to the very top of <head>

Oh man, thank you so much!

[douglasrosa0110]

for me, was the firebase "public" key path, setting to "build/web" (the path of main.dart.js generated by flutter build) solves my case.