Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Unexpected Token { in browser console on fresh new yeoman+fountainJS projects #1498

Closed
theCrius opened this issue Jan 24, 2018 · 8 comments
Closed

Comments

@theCrius
Copy link

theCrius commented Jan 24, 2018

Issue details

I'm using Yeoman with FountainJS to generate a new project.
As soon as it finish assembling it, I simply run the classic npm run serve. It finishes without errors but then I get this error in chrome browser console:

Uncaught SyntaxError: Unexpected token }

The error is reported to be generated from browser-sync-client.js?v=2.23.5:89.
My doubt is if the issue is actually in browserSync or in something else built by fountainJS package.
I tried building an angularJS (simple landing page) and angular (todo mcv) project but the error persist with both cases even if they're different framework/languages/source.

Steps to reproduce/test case

  1. Install Yeoman
  2. Add fountainJS
  3. Generate a project (keep it simple, I didn't continuous integration support for example)
  4. run npm run serve
  5. Open the browser to the newly running webserver
  6. Open the console

Please specify which version of Browsersync, node and npm you're running

From package,json:

  • "browser-sync": "^2.18.8",
  • "browser-sync-spa": "^1.0.3",

Others:

  • Node v9.3.0
  • Npm 5.6.0

Affected platforms

  • windows

Browsersync use-case

  • API
  • GULP

for all other use-cases, (gulp, grunt etc), please show us exactly how you're using Browsersync

From gulpfile.js:

const browserSync = require('browser-sync');

// [...]

function reloadBrowserSync(cb) {
  browserSync.reload();
  cb();
}

function watch(done) {
  gulp.watch(conf.path.tmp('index.html'), reloadBrowserSync);
  done();
}
@johanberonius
Copy link

I got this error too and figured out that browser-sync-client.js ends with the line //# sourceMappingURL=index.min.js.map but no newline after that.

When other plugins concatenate to that script the first line of the plugin script get corrupted.

For example, with browser-sync-ui the line becomes //# sourceMappingURL=index.min.js.map"use strict"; but the rest of the script till works.

But with browser-sync-spa the line becomes //# sourceMappingURL=index.min.js.map(function (bs) { and the rest of the script breaks.

(Also commented on the issue here: BrowserSync/browser-sync-client#45)

@johanberonius
Copy link

My temporary workaround is to remove the line with sourceMappingURL after install since /browser-sync/index.min.js.map doesn't seem to be served anyway.

In package.json:
"postinstall": "FILE=node_modules/browser-sync/client/dist/index.min.js; mv $FILE $FILE.bak; grep -v sourceMappingURL $FILE.bak > $FILE"

@shakyShane
Copy link
Contributor

@johanberonius Thanks for investigating :)

I will fix & release within a few hours.

@shakyShane
Copy link
Contributor

@johanberonius @theCrius please try browser-sync@2.23.6

@theCrius
Copy link
Author

Will do first thing in the morning (UK here)

Thanks for the quick fix :)

@johanberonius
Copy link

Yes, it works. Thanks for the quick fix!

@shakyShane
Copy link
Contributor

@johanberonius thanks to you for finding the bug!

@theCrius
Copy link
Author

Confirmed as well, it's fixed. Thanks to both of you!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants